Javascript 复选框选择全部取消选择并执行功能_Javascript_Jquery

Javascript 复选框选择全部取消选择并执行功能

javascript jquery

Javascript 复选框选择全部取消选择并执行功能,javascript,jquery,Javascript,Jquery,我有一堆复选框，当单击时，它们会将值传递到文本区域。然后，我有一个复选框，单击该复选框时会选中所有其他复选框。这一切都很好。我想做的是让复选框在单击全选时执行其功能。它目前可以工作，但只有在我刷新页面时才能工作。我希望在单击“全选”时发生以下是我到目前为止一直在玩的游戏： function setAllCheckboxes(divId, sourceCheckbox) { divElement = document.getElementById(divId); inpu

我有一堆复选框，当单击时，它们会将值传递到文本区域。然后，我有一个复选框，单击该复选框时会选中所有其他复选框。这一切都很好。我想做的是让复选框在单击全选时执行其功能。它目前可以工作，但只有在我刷新页面时才能工作。我希望在单击“全选”时发生

以下是我到目前为止一直在玩的游戏：

    function setAllCheckboxes(divId, sourceCheckbox) {
    divElement = document.getElementById(divId);
    inputElements = divElement.getElementsByTagName('input');
    for (i = 0; i < inputElements.length; i++) 
$('.checkbox').each(function() {
                this.checked = true;
                 this.click();              
            });
{
        if (inputElements[i].type != 'checkbox')
            continue;
        inputElements[i].checked = sourceCheckbox.checked;
    }
}

函数设置所有复选框（divId，sourceCheckbox）{
divElement=document.getElementById（divId）；
inputElements=divElement.getElementsByTagName（'input'）；
对于（i=0；i

复选框应使用onchange事件处理。在下面的代码中，每当以编程方式选中复选框时，我都会触发一个事件

下面的代码可能对您有所帮助

    function setAllCheckboxes(divId, sourceCheckbox) {
    divElement = document.getElementById(divId);
    inputElements = divElement.getElementsByTagName('input');
    for (i = 0; i < inputElements.length; i++) 
$('.checkbox').each(function() {
                this.checked = true;
                 /* this.click(); */              
                 this.fireevent('onChange');
                 /* or you can call this.onChange(); */
            });
{
        if (inputElements[i].type != 'checkbox')
            continue;
        inputElements[i].checked = sourceCheckbox.checked;
    }
}

函数设置所有复选框（divId，sourceCheckbox）{
divElement=document.getElementById（divId）；
inputElements=divElement.getElementsByTagName（'input'）；
对于（i=0；i

如果您已经在使用jQuery，那么可以使用jQuery的//，而不使用循环：

var$result=$（'.jsresult'）；
var$复选框=$（'.js复选框'）；
$checkbox.on（'change'，函数（e）{
var$checkbox=$（e.target）；
$result.append(
'' +
$checkbox.closest（'.js label'）.text（）+'is'+
（$checkbox.prop（'checked'）？'checked'：'unchecked'）+
''
);
});
$（'.js按钮'）。在（'click'，function（）上{
var$this=$（this）；
$checkbox.prop（'checked'），！$this.data（'checked'）；
$checkbox.trigger（'change'）；
$this.data（'checked'），！$this.data（'checked'））
});

复选框1
复选框2
复选框3
选中/取消选中全部
以防您只使用java脚本。
下面是一个非常简单的运行示例。它不使用任何外部库作为JQuery，占用的时间很短
HTML代码
<html>
    <head>
        <title>test</title>
        <script>
function amend(a)
{
document.getElementById("ta").value += a;
}

function checkAll()
{
var textboxes = document.getElementsByClassName("cb");
for(i=0;i<textboxes.length;i++)
{
textboxes[i].checked=true;
textboxes[i].onchange();
}

}

        </script>
    </head>
    <body>
        <textarea rows="4" cols="50" id="ta">
                Below the outputs
        </textarea>
        <div id="checkdiv">
            <input type="checkbox" onChange="amend(this.value)" value="data to add 1" class="cb">First</input>
            <br>
            <input type="checkbox" onChange="amend(this.value)" value="data to add 2" class="cb">Second</input>
            <br>
            <input type="checkbox" onChange="amend(this.value)" value="data to add 3" class="cb">Third</input>
            <br>
            <input type="checkbox" onChange="checkAll()">Check all</input>
        </div>
    </body>
</html>


测试
职能修订（a）
{
document.getElementById（“ta”）.value+=a；
}
函数checkAll（）
{
var textboxs=document.getElementsByClassName（“cb”）；
对于（i=0；它不能是实际的脚本，因为这将触发语法错误：Uncaught SyntaxError:unclauble continue语句
Sorry的可能重复，如果这是重复的话。我确实搜索了，但显然没有找到。我在另一个网站的评论部分找到了这部分代码，以查找答案。$（'.checkbox'）.each（函数（）{this.checked=true；this.click（）；}）
我不确定它应该放在哪里。我只是尝试了你发布的代码，它没有选择任何复选框。javascript不是太快对不起。你能不能也发布html代码以便更好地理解。它只是一堆数据1
复选框被选中时，复选框的值会通过javascript发送到textaera格雷格，我很乐意帮忙！