Question

我有这个javascript代码，它使复选框工作为无线电

JAVASCRIPT

$(function() {$('input[type=checkbox]').click(function() {
        $('input[type=checkbox]').attr('checked', false);
        $(this).attr('checked', true);
    });
});

HTML

<label title="cat"><input name="" type="checkbox" checked>cat</label>
<label title="dog"><input name="" type="checkbox" >dog</label>
<label title="lion"><input name="" type="checkbox" >lion</label>
<label title="fish"><input name="" type="checkbox" >fish</label>
<label title="turtle"><input name="" type="checkbox" >turtle</label>

当我使用1.8.3版本的旧jquery库时，它正在工作但是当我试图包含版本1.11.0的较新的jquery库时，它无法正常工作，

我该如何解决？

这里是http://jsfiddle.net/6upmbbf0/

如果你将左上角的jquery版本更改为1.8.3或更低版本，它可以工作但高于1.8.3则不然。

Answer 1

检索和更新复选框已检查状态的正确方法是.prop()。 .attr()只是检索或更新属性值; 它不一定会更新输入的基础状态 。

jQuery Core 1.9 upgrade guide提到行为已经改变，这就解释了为什么你的代码在jQuery＆lt;版本1.9。

Answer 2

使用not()代替切换复选框2次。如果您首先排除选中的复选框，并取消选中其他复选框，则效果会更好。

$('input[type=checkbox]').not($(this)).prop('checked', false);

小提琴：http://jsfiddle.net/6upmbbf0/3/

编辑，添加Salman A建议使用prop()代替attr()

Answer 3

使用＆＃39; prop＆＃39;而不是＆＃39; attr＆＃39;如

替换代码

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

如何修复javascript不能在较新的jquery库上工作但是在旧版本的jquery库上工作？

3 个答案: