jQuery 事件 onchange()

Question

我有一个简单的形式：

    <div class="class_a">
      <fieldset>
        <label><input type="radio" id="radio10" name="color" value="1" />Red</label><br />
        <label><input type="radio" name="color" value="2" />Yellow</label><br />    
        <label><input type="radio" name="color" value="3" />Blue</label><br />
        <label><input type="radio" name="color" value="4" />Purple</label><br />
      </fieldset>
     </div>
 <div class="block-cms">
       <fieldset>
        <label><input type="radio" name="time" value="6" />12</label><br />
        <label><input type="radio" name="time" value="7" />11</label><br />    
        <label><input type="radio" name="time" value="8" />10</label><br />
        <label><input type="radio" name="time" value="9" />9</label><br />
      </fieldset>
 </div>

我在这里尝试做的是使用 jQuery change() 隐藏第二个字段集。

$("input#radio10").change(function () {
        var checked = true;
        checked = checked && $(this).is(':checked');
        if ($('input#radio10:checked') ) {
            $('.block-cms').show()
            } 
        else {
            $('.block-cms').hide();
        }
    }); 

不知道这里出了什么问题。谁能建议我应该做些什么不同的事情？

Answer 1

您的 id 不应包含 #，这是针对选择器的，它应该只是 id="radio10"。

改变它，这就是你应该追求的：

$(".class_a :radio").change(function () {
  $(".block-cms").toggle($("#radio10:checked").length > 0);
}); 

你可以在这里测试一下。

Answer 2

首先，元素上的 id 应该是 radio10 而不是 #radio10。

然后使用这段代码

$("input[name='color']").change(function () {
    if ($('input#radio10').is(':checked') ) {
            $('.block-cms').show()
            }
        else {
            $('.block-cms').hide();
        }
    }); 

Answer 3

这是另一个解决方案（IMO 在 上有一个 id 对我来说似乎有点错误）：

$("input[name='color']").change(function () {
        if ($(this).val() == 1) {
            $('.block-cms').show()
            } 
        else {
            $('.block-cms').hide();
        }
    });