Javascript复选框:使用一个按钮将一个组更改为checked

javascript checkboxes: use a button to change a group to checked

本文关键字：一个 checked 按钮 Javascript 复选框      更新时间：2023-09-26

我一直在使用这个(它的工作/工作)与一个常规的网页，但当我尝试附加Jquery (v1.9.1 + Jquery移动v 1.2.0 -按钮样式和其他功能)，它似乎选择正确的对象(运行控制台.log，看看什么项目被抓取在数组中)，但它不更新在页面中的复选框(使其选中)尽管返回一个值"真"。当我在jsFiddle中做基本操作时它也会做同样的事情http://jsfiddle.net/artcase_1/6sasA/2/

function checkUncheck(name, setTo) {

    var c = document.getElementsByName(name);
    for (var i = 0; i < c.length; i++) {
        if (c[i].type == 'checkbox' || c[i].checked == 'false') {
            c[i].checked = setTo;
        }
    }
}
<!-- in the body: -->
<div data-role="fieldcontain">
    <fieldset data-role="controlgroup" data-type="horizontal">
        <legend>choose a level to view</legend>
        <input name="colors" type="checkbox" class="custom"
        id="redbtn" value="red" checked="checked" />
        <label for="redbtn">High</label>
        <input name="colors" type="checkbox" class="custom" id="yellowbtn"
        value="yellow" />
        <label for="yellowbtn">Med</label>
        <input name="colors" type="checkbox" class="custom" id="bluebtn"
        value="blue" />
        <label for="bluebtn">Low</label>
    </fieldset>
</div>
<input name="Show_all_btn" type="button" id="showall" onclick="checkUncheck('colors','true')"
value="check all" />

我建议你把javascript和HTML分开所以这将是你更新的js将是这样的:

var check_all = document.getElementById('showall');
function checkUncheck(name, setTo) {

var c = document.getElementsByName(name);
for (var i = 0; i < c.length; i++) {
    if (c[i].type == 'checkbox' || c[i].checked == 'false') {
        c[i].checked = setTo;
    }
}
}
check_all.addEventListener('click', checkUncheck.bind(null, 'colors', true), false);

这里有一个demo Fiddle

相关文章：