javascript - 在一个提示中包含 2 个相同的 Jquery 单选按钮

Question

我有这个:

$('input[name="toggle"]').bind('change',function(){
    var showOrHide = ($(this).val() == 1) ? true : false;
    $('.first-toggle').toggle(showOrHide);
 });
 $('input[name="toggle2"]').bind('change',function(){
    var showOrHide = ($(this).val() == 1) ? true : false;
    $('.second-toggle').toggle(showOrHide);
 });

基本上，我只想要一个 jquery 调用，而不是进行两个(或多个)调用，有没有一种简单的方法可以做到这一点？应该是一个更简单的方法。

我尝试使用 .parent() 但似乎无济于事。jsfiddle:

http://jsfiddle.net/jh48cqf9/

Answer 1

使用公共(public)类而不是增量类会使事情变得简单很多。然后就可以使用遍历来查找特定实例

HTML

<div class="toggle">Test 1</div>

JS:

 $(':radio').bind('change', function () { /* use more specific selector than ":radio" that matches main container */
    var showOrHide = ($(this).val() == 1) ? true : false;
    $(this).siblings('.toggle').toggle(showOrHide);
});

DEMO