-2

jQueryを介して動的に挿入しているHTMLがあります

クリック時に処理したい<p>タグの束です。

ただし、.clickこれらのタグは完全に無視されます。

これが私がやろうとしていることの例です

http://jsfiddle.net/cjds/tc2ty/1/

アップデート

クリックは機能していますが、理論にはまだ問題があります。

注：問題は、このデータはAJAX経由でフェッチされるため、しばらくすると受信されることです。また、変更される可能性があります。

したがって、例で正しいときに順序を切り替えると、実際のアプリケーションで解決策が得られません。まだ存在していない要素のクリックイベントを設定する方法に関する提案はありますか？

4

3 に答える 3

3

コードに問題はほとんどありません。まず、同じIDを持つ要素を複製しているので、IDは一意である必要があります。次に、発生している問題は、クリックイベントを委任していないためです。新しい動的要素を作成すると、以前に設定されたイベントは新しい要素に追加されません。これを機能させる方法はいくつかあります。

要素をキャッシュして、DOMに追加する前にクリックイベントを追加できます。 

var $p = $('<p class="reqImg">Random Data</p>').click(function(){ ... });
             --^-- a class not an id

または、最も近い静的な親（この場合はラッパー）のメソッドを使用して、委任を使用してイベントをアタッチできます。on

$('#wrapper').on('click', 'p.reqImg', function(){ 
  console.log('Testing for click'); 
});
于 2012-12-15T04:35:12.343 に答える
1

これは、要素が存在する前にイベントがバインドされるためです。<p>イベントをバインドする前に、タグを追加してみてください。

于 2012-12-15T04:27:11.757 に答える
1

オブジェクトにイベントフックを追加してから作成します。オブジェクトを作成して機能した後、フックを追加します。

$('#wrapper').html('<a id="reqImg">Random Data</p> ');

$('#reqImg').click(function(){
            alert('Testing for click');
});

</ p>

于 2012-12-15T04:28:05.070 に答える