一个网站的多个搜索框

Question

我目前试图实现它是一组增量（我希望这是正确的词）搜索框。我试图制作一个关于食谱的网站，我想让人们能够根据他们目前所拥有的成分搜索食谱，因此，而不是有10或15个搜索框凌乱的一切，我只想出现1个搜索框一次。

我在想这是如果你填充第一个搜索栏第二个将显示等等。

我需要做什么来实现这个目标？任何想法是受欢迎的。

Answer 1

HTML：

<input id="1" class="search" type="text" style="display: inline"> 
<input id="2" class="search" type="text"> 
<input id="3" class="search" type="text"> 

CSS：

.search { 
    display: none; 
} 

JQuery的：

$(document).ready(function() { 
    $('.search').each(function() { 
     var nextNum = 1 + (+$(this).attr('id')); 
     $(this).click(function() { 
      $('#' + nextNum).show(); 
     }); 
    }); 
}); 

---

见fiddle。