jquery无线组切换点击

Question

$("input[name=sample]").click(function(){ 
      $("#"+$(this).val()).show(); 
      $("#"+$("input[name=sample]:not(:checked)").val()).hide(); 
    }); 
}); 

我用这个在两个div之间切换。但是当我添加第三个div和单选按钮时，这对第三个不起作用。它在点击时显示，但不隐藏其他人。什么会导致这种情况？

Answer 1

你现在有隐藏，因此使用这样的一个以上的元素：

$('input[name="sample"]').on('click', function(){ 
     $("#"+this.value).show(); 
     $("input[name=sample]:not(:checked)").each(function() { 
      $('#'+this.value).hide(); 
     }); 
}); 

Answer 2

为所有Div添加一个班级，并在显示之前隐藏该班级。 （例如：类= “divHide”）

$("input[name=sample]").click(function(){ 
    $(".divHide").hide(); 
    $("#"+$(this).val()).show(); 
}); 

Answer 3

隐藏每个非选择的要素：

$("input[name=sample]").click(function(){ 
    $("#"+$(this).val()).show(); 
     $("input[name=sample]:not(:checked)").each(index, item){ 
      $("#" + $(item).val()).hide(); 
     }); 
    }); 
});