jquery - 选中和取消选中具有不同名称的单选按钮

Question

我知道如果我们有相同的名字，那么单选按钮会交替变化。但我希望它在点击时被选中和取消选中，而与另一个 radio 没有任何关系。

js fiddle :

http://jsfiddle.net/Jk6Sk/1/

html

<input type="radio" name="test1" value="male" checked>Male<br>
<input type="radio" name="test2" value="female" checked>Female

js(我试过了):

$("input[type=radio]").on("click",function(){
    if(!$(this).is(":checked")){
        $(this).prop("checked",true);
    }else{
        $(this).prop("checked",false);
    }
});

注意:

简而言之，它应该像复选框一样工作(这可能吗？？)

Answer 1

您可以取消选中所有选中当前的单选按钮点击事件。我会使用一个类来对这些类型的单选按钮进行分组，以避免在页面上包含不需要的单选按钮，并且要具体。

Live Demo

$("input[type=radio]").on("click",function(){   
    $("input[type=radio]").prop("checked",false);
     $(this).prop("checked",true);
});

根据评论编辑，需要保持单选按钮选中状态才能切换。

Live Demo

$("input[type=radio]").data('checkedStatus', true);
$("input[type=radio]").on("click",function(){   
    if($(this).data('checkedStatus') == true)
    {
        this.checked = false;
        $(this).data('checkedStatus', false);
    }
    else
    {
         $(this).data('checkedStatus', true);
        this.checked = true;
    }
});