Question

这是我的js代码：

<script type="text/javascript">
    $(document).ready(function(){
        $("button").click(function(){
            if($("#a").attr("checked")){
                $("#a").attr("checked",false);
            }else{
                $("#a").attr("checked",true);
            }
        })
    })
</script>

这是我的HTML代码：

<input type="checkbox"  id="a">
<button>123</button>

我单击浏览器上的按钮，该复选框只能在第一次和第二次切换状态。

但我不认为attr（）的问题，我之前有一些代码可以正常运行。

  $("#delete").click(function(){
        if($("input[name='del_id[]']").attr("checked")){
            $("input[name='del_id[]']").attr("checked",false);
        }else{
            $("input[name='del_id[]']").attr("checked",true);
        }
    });

有人可以帮助我吗？

Answer 1

使用prop()代替attr()，

$("button").click(function () {
   $("#a").prop("checked", !$('#a').prop('checked'));
});

Demo

Answer 2

如果使用jQuery版本1.8.3

，则代码是正确的

$(document).ready(function(){

        $("button").click(function(){
            if($("#a").attr("checked")){
                $("#a").attr("checked",false);
            }else{
                $("#a").attr("checked",true);
            }
        })
    })

小提琴

http://jsfiddle.net/YXkgm/1/

如果使用1.8以上使用道具

$(document).ready(function(){

        $("button").click(function(){
            if($("#a").prop("checked")){
                $("#a").prop("checked",false);
            }else{
                $("#a").prop("checked",true);
            }
        })
    })

小提琴

http://jsfiddle.net/YXkgm/

HTML复选框的状态无法在浏览器中呈现

2 个答案: