0

我正在尝试使用选择选项来显示其中有复选框但它不起作用的 <*div>。

这是我下面的脚本

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> 但在进行选择时不会显示它们。有什么我做错了吗？

4

3 回答 3

1

可能有一种更动态的方式可以做到这一点。
我看到您有很多重复的代码，例如：

if (select == $("#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-08T13:42:28.793 回答
1

我在您的代码中注意到的第一件事：

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

您尝试将 val 与元素进行比较，它不会匹配。

比看 if/else ：

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

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

    feeschedule1.hide();
}

您的代码中有很多错误，请在这个fiddle中看到它已更正。

要捕获选定的选项值，您必须执行以下操作：

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

你写道：

var feeschedule1 = $("feeschdule1");

它应该是

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

最后一件事是change函数括号没有正确关闭。编码时，请注意缩进，它会限制此类错误。

于 2013-03-08T13:34:42.957 回答
0

尝试这个：

        if (select == "nd1fulltime"){

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

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


        });

通过 if (select == $("#nd1f")) 您正在与元素进行比较。您需要比较元素的值。

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

于 2013-03-08T13:37:23.813 回答