選擇後鏈接輸入選項？

我想知道如何鏈接我的表單中的選擇後的輸入框。選擇後鏈接輸入選項？

我使用http://www.appelsiini.net/projects/chained來鏈接我的選擇，它的工作原理。但是，我需要調整它以允許輸入的鏈接。在下面的例子中，有人會選擇一個選項，例如有一個項目有強度，然後選擇值選項菜單，然後輸入值。我試圖也納入到這個項目，控制器，價值的3個選項輸入後，用戶可以選擇過濾更多，所以另一個框出現與力量，敏捷等相同的選項。http://jsfiddle.net/isherwood/XMx4Q/是一個例子我曾經將這個工作納入我自己的工作中。

<form id="myform" name="myform" method="post" action="<?php echo $_SERVER['PHP_SELF'];?>"> 
    <div> 
     <label for="searchterm">Name:</label> 
     <input type="text" name="searchterm"> 
    </div> 

    <div> 
     <div class="chainedSelectFilter"> 
      <select name="specificFilter" class="attribute"> 
       <option value="" selected>Select a Filter</option> 
       <option value="strength">Has Strength</option> 
       <option value="agility">Has Agility</option> 
       <option value="spirit">Has Spirit</option> 
       <option value="stamina">Has Stamina</option> 
      </select> 
       <select name="specificFilter" class="valueController"> 
        <option value=">" selected>></option> 
        <option value=">=">>=</option> 
        <option value="=">=</option> 
        <option value="<=">&#60;=</option> 
        <option value="<">&#60;</option> 
       </select> 

     </div> 
    </div> 
</div> 


<div> 
    <label for="submit"></label> 
    <input type="submit" name="submit" value="Filter"> 
</div>

來源

2014-12-07 dbodnar

您正在尋找這樣的事情http://jsfiddle.net/XMx4Q/3/ – Dave 2014-12-07 05:57:00

這是另一種方法http://jsfiddle.net/XMx4Q/6/ – Dave 2014-12-07 06:01:05

是的，第二個是我爲Dave所做的。鏈接選擇+輸入關閉我的一些初始選擇，而其他人有不同的設置。我的第一個選擇可以有像<=> [5]例如那麼另一個可能是，那就是結束了。 – dbodnar 2014-12-07 19:25:16

代碼下面參考展示瞭如何做到這一點。這是jsFiddle，顯示它正在工作。

HTML

<form id="myform"> 
    <div class="container"> 
    <select> 
     <option value=""></option> 
     <option value="one">one</option> 
     <option value="two">two</option> 
    </select> 
    <input type="text" class="chain" value="" placeholder="Type here"/> 
    </div> 
    <div class="container"> 
    <select> 
     <option value=""></option> 
     <option value="one">one</option> 
     <option value="two">two</option> 
    </select> 
    <input type="text" class="chain" value="" placeholder="type here"/> 
    </div> 
    <div class="container"> 
    <select> 
     <option value=""></option> 
     <option value="one">one</option> 
     <option value="two">two</option> 
    </select> 
    <input type="text" class="chain" value=""/> 
    </div> 
</form>

$('select').change(function() { 
    $(this).next('input').fadeIn(); 
}); 
$('body').on('keyup','input.chain',function() {  
    $(this).parent().next('div').fadeIn(); 
});

來源

2014-12-08 07:35:55 Dave

選擇後鏈接輸入選項？

回答

相關問題