Javascript 为什么我的自定义jQuery`change`事件会被触发两次？

我是与jQuery兼容的复合HTML输入

当

select

中的任何一个发生更改时，

警报将被调用两次。为什么?

给定一个简单的容器节点：

<span id="x"></span>

这是因为当您在下拉列表中更改值时，它会更改父级evelement drom结构。这意味着您正在更改A和B的A和B的值，所以它会自动更改，所以您必须停止事件传播

您必须删除以下代码

$(a) .change (function () {$(x) .trigger ('change');});
$(b) .change (function () {$(x) .trigger ('change');});

或者您必须使用preventDefault（）


建议此事件仅适用于输入、选择和文本区域，在任何情况下，发生的是对父元素的传播（气泡）

如果停止传播，则将工作：

$(a) .change (function (event) {
    $(x) .trigger ('change');
    console.log('a');
    event.stopPropagation();
});

$(b) .change (function (event) {
    $(x) .trigger ('change');
    console.log('b');
    event.stopPropagation();
});

因为a和b都是选择？你试过让b=el（'select#b'）和让a=el（'select#a'）吗？
el
创建一个新元素。
$(a) .change (function (e) {e.preventDefault(); $(x) .trigger ('change'); return false; });
$(b) .change (function (e) {e.preventDefault(); $(x) .trigger ('change'); return false; });

$(a) .change (function (event) {
    $(x) .trigger ('change');
    console.log('a');
    event.stopPropagation();
});

$(b) .change (function (event) {
    $(x) .trigger ('change');
    console.log('b');
    event.stopPropagation();
});