JQuery 更改事件有时不会触发。
要重现，请从位置选择元素中选择一些新值。 不出现警告框。 因此，更改事件不会在选择值更改时触发。
如何解决？
<html>
<head>
<script type="text/javascript" src="https://www.omniva.ee/widget/widget.js"> </script>
<link rel="stylesheet" type="text/css" href="https://www.omniva.ee/widget/widget.css">
<script
src="https://code.jquery.com/jquery-2.2.4.js"
integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI="
crossorigin="anonymous"></script>
</head>
<body>
<div id="omniva_container1"></div>
<script>
$(function () {
$( "#omniva_select1" ).change(function() {
alert('Change event does not fire');
});
});
var wd1 = new OmnivaWidget();
</script>
</body>最佳答案
您的问题是您正在尝试将事件监听器附加到尚不存在的 DOM 元素。
<html>
<head>
<script type="text/javascript" src="https://www.omniva.ee/widget/widget.js"> </script>
<link rel="stylesheet" type="text/css" href="https://www.omniva.ee/widget/widget.css">
<script
src="https://code.jquery.com/jquery-2.2.4.js"
integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI="
crossorigin="anonymous"></script>
</head>
<body>
<div id="omniva_container1"></div>
<script>
// Wait for element to exist.
function elementLoaded(elementQuery, callback) {
let queryForElement = function() {
// Query the DOM for any elemnets matching the elementQuery parameter
if ($(elementQuery).length) {
// Found elemnet(s) matching the elementQuery, aka Element is now loaded.
callback($(elementQuery));
} else {
// Query again in 500ms. (minimum delay)
setTimeout(queryForElement, 500);
}
}
queryForElement();
};
elementLoaded('#omniva_select1', function(element) {
// Element is ready to use.
console.log('Attatched');
element.change(function() {
console.log('Triggered');
});
});
var wd1 = new OmnivaWidget();
</script>
</body>上面的代码每 500 毫秒检查一次是否有与所提供的查询字符串匹配的元素。然后它调用提供的回调并终止。
关于javascript - 如何强制更改事件发生在选择元素上，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46263942/