0

<select class="listenToMe" /> 変化が何かをするとき、私はそれを持っています。また、クリックすると ajax リクエストを実行し、より多くの dom 要素を返し、その中に別のリンクがある別のリンクもあります。<select class="listenToMe" />

イベントリスナーをこの要素にも適用したいと思います。jQuery の on メソッドを使用しようとしていますが、機能していないようです。

JS

var selectListener = function() { alert('you change me!'};
$('.listenToMe').on("change", selectListener);

$('.addMore').click( function() {
  $.post('myWebPage.php', {} , (function(data) {
    $(this).before(data);
    // data is something like <div><select class="listenToMe" /></div>
  }).bind(this));
});

HTML

<div>
  <div>
    <select class="listenToMe" />
  </div>
  <div>
    <select class="listenToMe" />
  </div>
  <a class="addMore">Click me</a>
</div>

助言がありますか？

4

2 に答える 2

1

あなたが試すことができます

  $(document).on('change', '.listenToMe', function(){

   // Your code here
   })
于 2013-10-09T08:34:22.423 に答える
1

onのように使用しliveます。違いは微妙ですが重要です。マークアップで静的要素にアタッチonし、セレクターに基づいてイベントをフィルター処理します。このようにして、onイベントが範囲外になることはありません。たとえば、マークアップがある場合

<!-- this div is not dynamically loaded-->
<div id="mystaticDiv">
    <!--insert dynamic content here-->
</div>

動的マークアップを追加すると、次のようになります。

<!-- this div is not dynamically loaded-->
<div id="mystaticDiv">
    <!--insert dynamic content here-->
    <div class="myDynamicdiv></div>
</div>

再バインドを必要としない動的 div のクリックでイベントを発生させるには、次の jQuery を記述します。

$('#mystaticDiv').on('click', '.myDynamicdiv', function() {/*Do stuff*/});

だから私は自分onをにバインドして#mystaticDivいますが、フィルタリングしています.myDynamicdiv。.myDynamicdivこれで、必要なだけ s を追加でき 、これで機能します。

私は言及しliveた。これは非推奨ですが、試みたのと同じように機能します。これにより、アタッチ先のセレクターに基づくセレクターを使用して、ページのドキュメントにイベントがアタッチliveされます。So$('.myDynamicdiv').live('click', function() {/*Do stuff*/});は と直接等価$(document).on('click', '.myDynamicdiv', function() {/*Do stuff*/});です。私がこれに言及する理由は、これがあなたが使用しようとしていた方法ですon。

あなたのコード$('.listenToMe').on("change", selectListener);。動的コンテンツでは機能しません。このコードは、まだ存在しない動的コンテンツにイベントを関連付けます。したがって、 が実際にバインドされることはありません。興味深いことに$('.listenToMe').on("change", selectListener);、これはまさに内部$('.listenToMe').change(selectListener);で行われていることです。

于 2013-10-09T08:55:49.260 に答える