Javascript 循环遍历 Page 元素以更改状态

Javascript looping through Page elements to change states?

本文关键字：状态 元素 循环 遍历 Page Javascript      更新时间：2023-09-26

这相对简单，但我错过了一些东西。 我在页面上有 10 个复选框，在表单中的表格中。 它们都有add0，add1，add2等名称和id。 我想构建一个"选中/取消选中所有"复选框，但我的代码似乎不起作用。 在火狐上，使用火虫，但它似乎无法遵循脚本执行。

function checkboxprocess(current)
{
    for (i = 0; i < 10; i++)
    {
        if (current.checked)
        {
            document.getElementById("add" + i).checked = true;
        }
        else
        {
            document.getElementById("add" + i]).checked = false;
        }
    }
}

复选框：

echo "Select All: <input type='"checkbox'" name='"add'" id='"add'" value=1 onChange='"checkboxprocess(this)'"><br>";

代码中有额外的]：

document.getElementById("add" + i ] ).checked = false;

而且您不必每次在循环中检查是否current检查，您可以像这样轻松完成：

function checkboxprocess(current) {
    for (i = 0; i < 10; i++) {
            document.getElementById("add" + i).checked = current.checked;
            // current.checked will return true/false
    }
}
<form>
    Select All: <input type="checkbox" onChange="checkboxprocess(this)">
    <br /> <br />
    <input type="checkbox" id="add0">
    <input type="checkbox" id="add1">
    <input type="checkbox" id="add2">
    <input type="checkbox" id="add3">
    <input type="checkbox" id="add4">
    <input type="checkbox" id="add5">
    <input type="checkbox" id="add6">
    <input type="checkbox" id="add7">
    <input type="checkbox" id="add8">
    <input type="checkbox" id="add9">
</form>

相关文章：