【问题标题】:Setting checkbox as checked with jQuery将复选框设置为使用 jQuery 选中
【发布时间】:2013-07-05 15:43:47
【问题描述】:

我有两个输入复选框,我想用 jQuery 选中/取消选中它们:

<input type="checkbox" name="user1" value="1" id="u1" onclick="loadUserCalendar(1)">
<input type="checkbox" name="user2" value="2" id="u2" onclick="loadUserCalendar(2)">

JavaScript 代码:

var list = new cookieList("calendar_users"); 
var users = list.items();
for (var i = 0; i < users.length; i++) {
    $('input[name="user' + users[i].substr(1,1) + '"]').attr('checked', true);
    console.log('substring: ' + users[i].substr(1,1));
    console.log('enabling user ' + users[i]);
}

var users 包含以下值:u1,u2。为了只获取用户 ID,我执行了一个子字符串,它可以让我得到正确的数字,如下面的控制台输出所示。

控制台输出:

substring: 1
enabling user u1
substring: 2 
enabling user u2 

我不知道,为什么在代码运行时未检查复选框。我在这里做错了什么?

编辑:由于兼容性原因,我使用的是 jQuery 1.4.4,这就是我使用 .attr()

的原因

【问题讨论】:

    标签: javascript jquery arrays input checkbox


    【解决方案1】:

    内联事件处理程序 (onclick="loadUserCalendar(1)") 不是 jQuery 方式。您的 html 中不应包含任何内容。摆脱它们并添加到您的 jquery 中:

    $(function() {
        $('form').on('click',':checkbox', function() {
            loadUserCalendar($(this).val());
        });
    });
    

    但也许你想要的是这样的:

    $(function() {
        $('form').on('click',':checkbox', function() {
            $('form :checkbox').attr('checked','checked');
        });
    });
    

    jquery 1.ancient 版本:

    $(function() {
        $('input[type=checkbox]').live('click', function() {
            // do things
        });
    });
    

    【讨论】:

    • 上面写着:Uncaught TypeError: Object #&lt;Object&gt; has no method 'on'
    • 您使用的是什么版本的 jQuery? 1.4.土豆?
    • 由于兼容性原因,我使用的是 jQuery 1.4.4
    • 你的意思是由于不兼容的原因,哈哈。我已经更新了我的答案。请考虑更新您的兼容性。
    • 谢谢。这修复了“非 jQuery 方式”。如果我重新加载我的页面,我会再次丢失选中的复选框,这是我的主要问题。你也有这个问题的答案吗?
    【解决方案2】:

    你使用的是什么版本的 jQuery?

    你必须尝试类似的东西:

    $('input[name="user' + users[i].substr(1,1) + '"]').attr('checked', 'checked');
    

    $('input[name="user' + users[i].substr(1,1) + '"]').prop('checked', 'checked');
    

    第二个是jQuery 1.6+

    【讨论】:

    • 嘿,我尝试了第一种方法,但仍然没有结果。该复选框未被选中。第二个不能用,因为我用的是 jQuery 1.4.4。
    【解决方案3】:

    当您想要检查某些内容时,您必须执行以下操作:

     $('.myCheckbox').attr('checked','checked');
    

    【讨论】:

    • 请确保您拥有正确的选择器 $('!your selector!').attr('checked', 'checked);
    • 这正是问题所在,这就是我发布此问题的原因。如果您认为选择器错误,请告诉我正确的选择器,我将接受它作为答案。
    • 可能是 JQuery 问题。我建议你不要使用如此复杂的陈述。而是使用带有#u1、#u2、...的id选择器
    【解决方案4】:

    如果你已经创建了复选框动态使用jQuery on 方法,因为简单的函数将无法访问这些元素。

    【讨论】:

    • live 已经被弃用了几个世纪。
    【解决方案5】:

    关于复选框的初始化,我建议如下:

    $('input[type=checkbox]').each(function(index, box) {
        $(box).attr('checked', $.inArray($(box).attr("id"), users) != -1);
    });
    

    【讨论】:

      猜你喜欢
      • 2010-09-30
      相关资源
      最近更新 更多