Javascript 选中jQuery复选框时的操作

我有一个复选框，选中时应显示表行，未选中时应隐藏行。。下面是我的代码：

        <tr class='row New Request' style="display:none">
            <td>Storage</td>
            <td><input type="checkbox" name="storage" value="storage"></td>
        </tr>
        <tr class='row New Request' style="display:none">
            <td>Network Infrastructure</td>
            <td><input type="checkbox" id="network" name="network" value="network"></td>
        </tr>
        <tr class='subrow network' style="display:none">
            <td><input type="checkbox" id="Wireless" name="Wireless" value="Wireless Connection">Wireless Connection</td>
            <td><input type="checkbox" id="LAN" name="LAN" value="LAN Connection">LAN Connection</td>
        </tr>
        <tr class='row New Request' style="display:none">
            <td>Security Infrastructure</td>
            <td><input type="checkbox" name="security" value="security"></td>
        </tr>
        <tr class='row New Request' style="display:none">
            <td>New Requset 4</td>
            <td></td>
        </tr>

存储
网络基础设施
无线连接
局域网连接
安全基础设施
新要求4

对于jQuery，这里是：

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>
        function changeVal() {
            $('#myHeader').html(this.name);
            $(this).closest('tr').nextAll('.row').hide();
            $(this).closest('tr').nextAll('.subrow').hide();
            $('.'+this.value).show();
            var tempText = "";
            switch(this.value)
            {
                case "Inquiry":
                    tempText="Send Inquiry";
                    break;
                case "Feedback":
                    tempText="Send Feedback";
                    break;
                case "Complain":
                    tempText="File Complain";
                    break;
                case "Request":
                    tempText="New Request";
                    break;
            }
            $('#myHeader').html(tempText).toggle(this.value != 'default');
        }

        $(function(){
            $('#contactSelect').change(changeVal);
        });
    </script>
    <script>
        function changeValSub() {
            $(this).closest('tr').nextAll('.subrow').hide();
            //$('.'+this.value).show();
            alert($(this).select() == false);
            if($(this).select() == false)
                $('.'+this.value).hide();
            else
                $('.'+this.value).show();
        }

        $(function(){
            $('#network').change(changeValSub);
        });
    </script>

函数changeVal（）{
$（'#myHeader'）.html（this.name）；
$（this）.closest（'tr'）.nextAll（'.row'）.hide（）；
$（this）.closest（'tr'）.nextAll（'.subrow'）.hide（）；
$（'.+this.value）.show（）；
var=”；
开关（此值）
{
案件“调查”：
testext=“发送查询”；
打破
案例“反馈”：
testext=“发送反馈”；
打破
“投诉”一案：
testext=“文件投诉”；
打破
案例“请求”：
testext=“新请求”；
打破
}
$（'#myHeader'）.html（试探文本）.toggle（this.value！=“default”）；
}
$（函数（）{
$（'#contactSelect'）.change（changeVal）；
});
函数changevalub（）{
$（this）.closest（'tr'）.nextAll（'.subrow'）.hide（）；
//$（'.+this.value）.show（）；
警报（$（this）.select（）==false）；
if（$（this）.select（）==false）
$（'.+this.value）.hide（）；
其他的
$（'.+this.value）.show（）；
}
$（函数（）{
$（“#网络”）.change（changevalub）；
});

这是完整表的一部分，它根据下拉列表和复选框显示/隐藏行。

使用

$。is（'：checked'）

而不是

$。select（）

。i、 e

function changeValSub() {
  $(this).closest('tr').nextAll('.subrow').hide();
  if ($(this).is(':checked')) {
    $('.'+this.value).show();
  }
}

---

请参见聊天室中讨论的。我们做了一些修复，比如将id添加到安全复选框中，删除回调函数并改用toggle

以下是最后一个JSFIDLE：

---

可能是的副本。把它放在JSFIDLE中，我会为您做的，它非常简单。没有帮助。。我需要根据复选框选择显示/隐藏行。。当前，将显示行，取消选中时不隐藏行checkbox@Chris：这是链接：@Chris：你能评论一下你将要做的更新吗？

.toggle();