Javascript-以编程方式触发任何浏览器的checkBox的onChange事件

Javascript - Programmatically trigger the onChange event of a checkBox for any browser

本文关键字：checkBox onChange 事件 浏览器 任何 编程 方式触 Javascript-      更新时间：2023-09-26

我在HTML中有一些复选框，设置如下：

<td nowrap width='25%'><label><input type='checkbox' name='chk[]' checked onChange="updateWindow('Label 1', this.checked)">&nbsp;Label 1</label></td>

我还选中了所有/取消选中这些复选框的所有链接：

<td><a href="javascript:checkAll(0);">Unckeck all</a></td>

使用此代码：

function checkAll(checkValue) {
    checkboxes = document.getElementsByName('chk[]');
    for (var checkbox in checkboxes) {
        checkbox.checked = checkValue;
        activateEvent(checkbox, 'change');
     }
}

开始的问题是，像这样选中/取消选中复选框不会触发onChange事件和关联的方法。所以我手动触发它调用：

function activateEvent(item, actionShortName) {
    if (document.createEventObject){    // dispatch for IE
        item.fireEvent("on" + actionShortName); 
    }
    else {  // dispatch for firefox + others
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent(actionShortName, true, true); // event type,bubbling,cancelable
        item.dispatchEvent(evt);
    }
}

这适用于IE8和一些旧版本的Firefox。但是在firefox23上，我有一个javascript错误告诉我：

"TypeError: item.dispatchEvent is not a function"

如何使此功能适用于所有浏览器

您的for循环错误。checkboxes将是一个NodeList，您不能通过它来for(in)（除非您对属性名称感兴趣）。

使用常规的for (var i = 0; i < checkboxes.length; ++i) checkboxes[i]...循环。

相关文章：