選択要素で強制的に変更イベントが発生する方法

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>

出典

2017-09-17 Andrus

まだ存在しないDOM要素にイベントリスナーをアタッチしようとしていると思います。 – Olian04

javascriptのsetTimeoutメソッドを使用してイベントの添付を遅延させるか、futureのif要素を作成するためにイベントの添付ファイルを定義する必要がありますか？ – Andrus

あなたの問題は、あなたがまだ存在していない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ミリ秒。次に、提供されたコールバックを呼び出して終了します。

出典

2017-09-17 12:18:27 Olian04

問題を解決するためのベストプラクティスは何ですか？ widget.jsはサードパーティ製のサーバーにあり、このサーバーでは変更できません。 – Andrus

@Andrus [この質問]（https://stackoverflow.com/questions/5525071/how-to-wait-until要素がDOMに注入された後にいくつかのJSを実行する方法についてのものです。 – Olian04

@Andrus私は、上記の投稿の解決策の1つを反映するために私の答えを更新しました。 – Olian04

選択要素で強制的に変更イベントが発生する方法

答えて

関連する問題