一個網站的多個搜索框

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。