jquery，隐藏/显示选择选项

我想使用select选项来显示一个< * div>的复选框，但它不工作。jquery，隐藏/显示选择选项

这里是我下面的脚本

jQuery的

$(document).ready(function() { 
     $(".feeschedule1").hide(); 
     $(".feeschedule2").hide(); 
     $("#select").change(function(){ 
      var feeschedule1 = $(".feeschdule1"); 
      var feeschedule2 = $(".feeschdule2"); 
      var select = $("#select").val(); 

     if (select == $("#nd1f")){ 

      feeschedule1.show(); 
     } 
     }else{ 

      feeschedule1.hide(); 
     } 
     if (select == $("#nd2f")){ 

      feeschedule2.show(); 
     } 
     }else{ 
      feeschedule2.hide(); 

     }) 


    });

HTML

<form action="" method=""> 
    <select id="select"> 
     <option id="nd1f" value="nd1fulltime">ND1 FULL TIME</option> 
     <option id="nd2f" value="nd2fulltime">ND2 FULL TIME</option> 
    </select> 
    <div class="feeschedule1"> 
     <tr> 
      <td><label for="schoolfees">SCHOOL FEES ND1 FULL TIME</label></td> 
      <td><input type="checkbox" value="15000" ></td> 
     </tr> 
    </div> 
    <div class="feeschedule2"> 
     <tr > 
      <td ><label for="schoolfees">SCHOOL FEES ND2 FULL TIME</label></td> 
      <td><input type="checkbox" value="15000" ></td> 
     </tr> 
    </div> 
</form>

它隐藏了< * DIV>相当好的，但它并不时向他们展示选择。有什么我不正确的做法吗？

来源

2013-03-08 Precious George

是什么$（” feeschdule1" 。）meaning.i不明白 – PSR 2013-03-08 13:31:32

当你分配一个jQuery选择到一个变量是一个很好的做法，用$前缀变量，这样就很清楚它是一个选择器变量。 'VAR feeschedule1 = $（”。feeschdule1 “）;'会为'变量$ feeschedule1 = $（”。feeschdule1" ）来最好表现;' – 2013-03-08 13:39:52

的第一件事情我自己的代码中发现：

if (select == $("#nd1f"))

你试图将VAL比较的元素，它会不匹配。

比看到的if/else的：

if (select == $("#nd1f")){ 

    feeschedule1.show(); 
} // This is wrong ! 
}else{ 

    feeschedule1.hide(); 
}

你在你的代码有许多错误，看到它在这个fiddle纠正。

要catche选择的选项值，你必须做这样的事情：

var select = $(this).find('option:checked').val();

您所著：

var feeschedule1 = $("feeschdule1");

应该

var $feeschedule1 = $(".feeschedule1");

最后的东西是那 change功能括号里没有正确关闭。当你编码时，要小心缩进，它会限制这些错误。

来源

2013-03-08 13:34:42 soyuka

试试这个：

 if (select == "nd1fulltime"){ 

     feeschedule1.show(); 
     }else{ 
     feeschedule1.hide(); 
     } 
     if (select == "nd2fulltime"){ 

     feeschedule2.show(); 
     }else{ 
     feeschedule2.hide(); 


     });

通过IF（选择== $（ “＃nd1f”））您正在使用element.What比较，你需要是比较元素的值。

不$("#nd1f")它的值应该匹配...

来源

2013-03-08 13:37:23

有可能是你可以这样做一个更有活力的方式。
我看你有很多重复的代码，如：

如果（选择== $（ “＃nd2f”））{

你不想使用重复if语句。一个更好的办法可能是使用：

<select class="select" onchange="javascript:myfunction(this.value)">

那么你的JavaScript动态：

options = [ 'nd1fulltime', 'nd2fulltime' ]; 
schedules = [ '.feeschedule1', '.feeschedule2' ]; 

function myfunction(choice) { 
    for (i in options) { 
     if (choice == options[i]) { 
      $(schedules[i]).show(); 
     } 
     else { 
      $(schedules[i]).hide(); 
     } 
    } 
}

来源

2013-03-08 13:42:28 jackcogdill

jquery，隐藏/显示选择选项

回答

相关问题