javascript 事件没有被触发

Question

我有一个关于旅客人数的下拉菜单。

当我更改值(例如选择 2)时，它会显示更多下拉菜单(在本例中为 2 个下拉菜单)，用于输入旅行者的年龄。

这是现有功能。现在我创建了另一个下拉菜单，在这里我编写了一个 onChange 函数来设置旅行者的值:

document.getElementById("travellers").value="1";

我希望年龄的附加下拉菜单能够单独出现，但这并没有发生。

如何使用 jQuery/JavaScript 实现此目的？

Answer 1

当您以编程方式修改值时，事件将不会触发。您需要触发事件。

使用普通 JS

var select = document.getElementById("travellers");
//fire the event
if("createEvent" in document) { //NON IE browsers
    var evt = document.createEvent("HTMLEvents");
    evt.initEvent("change", false, true);
    select.dispatchEvent(evt);
} else { //IE
    var evt = document.createEventObject();
    select.fireEvent("onchange", evt);
}

当您使用 jQuery 标记您的问题时，您可以使用 .trigger()

$("#travellers").trigger("change");