2

此代码适用于 jQuery，版本。1.6

<input type="checkbox" class="radio" value="1" name="sameName" />
<input type="checkbox" class="radio" value="1" name="sameName" />
<input type="checkbox" class="radio" value="1" name="sameName" />

$("input:checkbox").click(function() {
    if ($(this).attr("checked") === true) {
        var group = "input:checkbox[name='" + $(this).attr("name") + "']";
        $(group).attr("checked", false);
        $(this).attr("checked", true);
    } else {
        $(this).attr("checked", false);
    }
});​

但是，如果我使用 jQuery 1.7 的新方法更改代码，它不会工作吗？为什么？谢谢你的时间：

$("input:checkbox").on('click', function() {
    if ($(this).attr("checked") === true) {
        var group = "input:checkbox[name='" + $(this).attr("name") + "']";
        $(group).attr("checked", false);
        $(this).attr("checked", true);
    } else {
        $(this).attr("checked", false);
    }
});​
4

3 回答 3

7

使用.prop('checked',true)而不是.attr.

http://api.jquery.com/prop

此外，if ($(this).attr("checked") === true)可以简化为

if ($(this).prop("checked")) {
于 2012-11-13T14:39:20.240 回答
3

attr 返回一个字符串。您应该使用.prop为 jQuery 1.6+ 设置选中的属性

$("input:checkbox").on('click', function() {
    if (this.checked) {
        var group = "input:checkbox[name='" + $(this).attr("name") + "']";
        $(group).prop("checked", false);
        $(this).prop("checked", true);
    } else {
        $(this).prop("checked", false);
    }
});​

来自 jQuery .prop() 文档

应该使用 .prop() 方法来设置禁用和检查，而不是 .attr() 方法。

于 2012-11-13T14:39:28.400 回答
1

因为你的代码是错误的。.on() 事件需要元素的容器。

因此，您的HTML代码应如下所示：

<div id="chkContainer">
    <input type="checkbox" class="radio" value="1" name="sameName" />
    <input type="checkbox" class="radio" value="1" name="sameName" />
    <input type="checkbox" class="radio" value="1" name="sameName" />
</div>

和JAVASCRIPT函数如下：

$('#chkContainer').on('click', 'input:checkbox', function() {
    if ( $(this).is(':checked') ) {
        var group = "input:checkbox[name='" + $(this).attr("name") + "']";
        $(group).attr("checked", false);
        $(this).attr("checked", true);
    } else {
        $(this).attr("checked", false);
    }
});

这是给你的一个例子：http: //jsfiddle.net/5xDzv/1/

于 2012-11-13T14:51:57.090 回答