jquery如何取消选中单选按钮

时间:2014-07-09 07:37:44

标签: javascript jquery

我试图解决这个问题,但我的重置按钮无法取消选中单选按钮..... :( 希望这里的专家可以帮助我解决我的问题。 THX !!!!

刚刚创建了小提琴http://jsfiddle.net/8GLPC/

<input type="radio" class="radio" name="r[][9]" id="id_19" value="1|9">
                                <label for="id_19">Choice 1</label>
<input type="radio" class="radio" name="r[][9]" id="id_29" value="2|9">
                                <label for="id_29">Choice 1</label>
<button class="reset1" value="9">Reset</button>


$(document).ready(function(){
    $(".radio")
        .button();

    $(".reset1")
        .button()
        .click(function(){
            var radio = $('[name="r[][9]"]');
            radio.prop('checked',false);
            return false;
        })
});

2 个答案:

答案 0 :(得分:5)

更改基础单选按钮后,您需要刷新jQuery button状态。

JSFiddle:http://jsfiddle.net/TrueBlueAussie/BPv7F/1/

$(document).ready(function(){
    $(".radio")
        .button();

    $(".reset1")
        .button()
        .click(function(){
            var radio = $('[name="r[][9]"]');
            radio.prop('checked', false).button("refresh");
            return false;
        })
});

jQuery UI按钮创建单独的元素,因此更改单选按钮状态对它们没有立即影响。

参考:http://api.jqueryui.com/button/#method-refresh

如果您查看DOM,在Chrome的F12 DOM检查器中,您会看到button()在每个单选按钮之前创建一个LABEL和SPAN。实际的单选按钮采用类ui-helper-hidden-accessible

设置

答案 1 :(得分:-1)

试试这个:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<body>

<h3>A demonstration of how to uncheck a Checkbox</h3>

Checkbox: <input type="checkbox" class="myCheck" checked>
Checkbox2: <input type="checkbox" class="myCheck" >
Checkbox3: <input type="checkbox" class="myCheck" >
<p>Click the "Try it" button to check the checkbox.</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
$(".myCheck").prop('checked' , false);
}
</script>

</body>

基本上,它取消选中类.myCheck

的所有复选框