jquery - 选中复选框时显示另一个选项

Question

选中复选框后，我在尝试显示“T 恤”尺寸时遇到问题。我正在使用 jQuery，但我无法让代码正常工作。这是到目前为止我的代码:

<script type="text/javascript">
    $(document).ready(function(){
        $('#tshirt').attr('checked'); 
        $("#sizes").show();
    });
);
</script>


<b>Cool T-Shirt</b>: <input type="checkbox" id="tshirt" name="tshirt"> <span class="price">$15</span>            
<span id="sizes"><bSize</b>: <input type="checkbox" name="size" value="S"> <span class="price">Small</span></span>

目前，ID“sizes”通过 CSS 设置为 display: none。我遇到的困难是，当用户选择 ID 为“tshirt”的复选框时，我希望显示 ID“尺寸”。

Answer 1

您需要将代码放入 click() 中处理程序，如下所示:

$(document).ready(function () {
    $('input#tshirt').click(function () {
        if($(this).is(':checked')) {
            $("#sizes").show();
        } else {
            $("#sizes").hide();
        }
    });
});

这将显示#sizes当复选框被选中时，当取消选中时将再次隐藏它们。

不清楚为什么你有 $('#tshirt').attr('checked');在你当前的JS中，你可以简单地添加 checked="checked"给您<input>使其在页面加载时进行检查。