选择标记onchange不适用于移动设备

Select tag onchange not working on mobile

本文关键字：移动 适用于 不适用 onchange 选择      更新时间：2023-09-26

我正在选择标签上设置一个onchange事件，如下所示：

Dictionary.prototype.setSelectEvent = function setSelectEvent() {
    var selects = document.querySelectorAll('.dictionary-page__select');
    if (selects) {
        for (var i = 0; i < selects.length; i++) {
            selects[i].onchange = function() {
                this.onChange();
            }.bind(this);
        }
    }
};

这在桌面上运行良好。事件已正确设置并激发，没有任何错误。在移动设备上，事件根本没有被启动。我也试过使用onblur，但没有效果。使用普通javascript，如何在select标记上设置事件并使其在移动设备上工作？

解决方案：第三方库覆盖桌面事件，但不覆盖移动事件。必须在事件中传递select对象。

Dictionary.prototype.setSelectEvent = function setSelectEvent() {
    var selects = document.querySelectorAll('.dictionary-page__select');
    var that = this;
    if (selects) {
        for (var i = 0; i < selects.length; i++) {
            selects[i].onchange = function() {
                that.onChange(this);
            };
        }
    }
};

Dictionary.prototype.setSelectEvent = function setSelectEvent() {
    var selects = document.querySelectorAll('.dictionary-page__select');
    for (var i = 0; i < selects.length; i++) {
        selects[i].onchange = this.onChange.bind(this);
    }
};

前面的代码应该做您想要做的事情，在NodeList上集成它，直到selects.length。您还将注意到，您可以直接绑定到this，我们不需要每次在Dictionary上调用onChange方法时都定义一个新的onChange函数。

编辑：删除了对数组的转换。

相关文章：