我是一个jQuery兼容的复合HTML输入trying to make.
在this example中,当任一选择更改时,将调用警报两次.为什么？
给定一个简单的容器节点：
这是一个完全有效的演示：
function el (type) {
return document .createElement (type);
}
function opt (sel,value) {
let node = el ('option');
node .value = value;
node .appendChild (document .createTextNode (value));
sel .appendChild (node);
}
let x = document .getElementById ('x');
let a = el ('select');
let b = el ('select');
x .appendChild (a);
x .appendChild (b);
opt (a,'a_1');
opt (a,'a_2');
opt (b,'b_1');
opt (b,'b_2');
$(a) .change (function () {$(x) .trigger ('change');});
$(b) .change (function () {$(x) .trigger ('change');});
$(x) .change (function () {alert ('changed');});
最佳答案
因为当您在下拉列表中更改值时,它会更改父元素的drom结构.它意味着你正在改变A和B的值,它的A和B的专利是X,所以它会自动改变,所以你必须停止事件传播
原文链接：https://www.f2er.com/jquery/427778.html$(a) .change (function () {$(x) .trigger ('change');});
$(b) .change (function () {$(x) .trigger ('change');});
或者你必须使用preventDefault();
$(a) .change (function (e) {e.preventDefault(); $(x) .trigger ('change'); return false; });
$(b) .change (function (e) {e.preventDefault(); $(x) .trigger ('change'); return false; });
