切换仅显示/隐藏最近的无线功能

Question

我这里有一个有效的例子：http://jsfiddle.net/infatti/esLMh/

为什么说“不”不是为了隐藏？

$('.hide-show input').change(function() {
  $(this).closest('.hide-show').next('.hide-show-yes').toggle(this.value == 'yes');
  $(this).closest('.hide-show').next('.hide-show-no').toggle(this.value == 'no');
});
$('.hide-show input:checked').change(); //trigger correct state onload

Answer 1

根据您的标记，next只选择所选元素的下一个直接同级元素(如果它与指定的选择器匹配)，您应该调用两个next方法来选择第二个目标元素。

$('.hide-show input').change(function () {
    $(this).closest('.hide-show')
           .next('.hide-show-yes').toggle(this.value == 'yes')
           .next('.hide-show-no').toggle(this.value == 'no');
});

http://jsfiddle.net/A8ycG/

您也可以使用nextAll方法，但这种方法在这种情况下是过度杀伤力。