Question

我一直在使用这个（它工作/工作）与常规网页，但当我尝试附加Jquery（v1.9.1 + jquery mobile v 1.2.0 - 用于按钮样式和其他功能）时似乎选择了正确的对象（运行一个console.log来查看数组中正在抓取的项目），但它不会更新页面中的复选框（使其检查），尽管返回值为“true”。当我在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" />

Answer 1

我建议将您的javascript与HTML分开，这样您的更新j就会是这样的：

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);

这是一个演示Fiddle

javascript复选框：使用按钮将组更改为已选中

1 个答案: