在按类选择时,如何对每个控件应用不同的更改?

时间:2013-06-11 18:16:48

标签: javascript jquery

我有一系列同一个班级的复选框。我希望获得与集合相同的所有类的复选框,并提取其ID和检查状态。但是我所看到的所有按类选择的例子只对该类的所有元素应用了一个更改。我需要获得该类的所有复选框元素的集合/数组,以便我可以迭代它们。

好的,我已经尝试了一些建议但没有运气。 这会在IE8中抛出一个Object Expected错误:

var checkboxes = document.querySelectorAll("input[type='checkbox'].chkRoles");

每次都给我一个空数组,无论检查什么。

    var mandatoryRoleIDs = [];

    $('input.chkRoles[type="checkbox"]').each(function (i, checkbox)
    {
        if ($(checkbox).attr('checked'))
            mandatoryRoleIDs.push($(checkbox).attr('id'));
    });

2 个答案:

答案 0 :(得分:2)

var checkboxes = document.getElementsByClassName('classname');

然后迭代它以完成你需要的工作。

for(var i = 0; i < checkboxes.length; i++) {
    var current = checkboxes[i];
    // stuff on current
}

在这种简单的情况下,不需要使用jQuery,并且旧版浏览器并不完全支持querySelectorAll;香草JS是最好的方法!

由于你需要支持IE8(该死的微软)你应该这样做:

var inputs = document.getElementsByTagName('input'),
    className = "classname";
for (var i = 0; i < inputs.length; i++) {
    var current = inputs[i];
    if (current.type !== 'checkbox' || current.className.indexOf(className) === -1) continue;
    //do stuff with current
}

查看此代码段的working JSFiddle example

答案 1 :(得分:2)

由于你的问题是用jQuery标记的,所以你可以用jQuery的each()函数来实现它:

$('input.someClass[type="checkbox"]').each(function(i,el){
    var $this = $(el),
        id = $this.attr('id'),
        checked = $this.attr('checked');
    /* do stuff with id and checked */
});