0

jqueryとajaxを使用してデータベースからコンテンツを表示するページがあります。新しいコンテンツや画像の追加、編集、削除など、ページには多くのプロセスがあり、すべて ajax を使用しています。しかし、データベースから表示されたコンテンツで、click、mouseenterなどのイベント関数の一部が機能しません。

例：これは、ページに画像を表示する方法です

for(var i=0;i<images.length;i++)
{
$("#content").append("<img src='"+images[i]+"' class='img'  width='300' height='200' />");
}

画像は正常に表示されます。しかし、このような画像のクリックイベントで何かをしようとすると、うまくいきません

 $("#content .img").on('click',function()
  {
  //here comes my process, but its not working
   }

この問題を解決するのを手伝ってください。

4

3 に答える 3

3

試す：

$("#content").on("click", ".img", function() {

});

問題は、実行時に$("#content img")存在する要素の jQuery コレクションを作成することです。新しい要素を動的に追加し始めると、イベント リスナーが自動的に適用されません。

$("#content").on("click", ".img")イベント委任を提供するのは何ですか。したがって、実際に起こっているのは、適用される$("#content")が、そのイベントが一致するセレクターを持つ子孫から発生した場合にのみ発生するイベントリスナーです (.imgこの場合)。

詳細はhttp://api.jquery.com/on/をご覧ください。

于 2013-10-04T06:38:31.067 に答える
0

このようにしてみてください

$(document).on('click', '#content .img',function()
{
  ...
});
于 2013-10-04T06:38:45.013 に答える
0

この問題は、動的コンテンツを追加しようとすると常に発生します。したがって、これを解決するには、常にいくつかの点に留意してください。

  • いずれも静的要素を使用して、イベントを適用しようとしている動的要素を参照します。 例：あなたの場合、使ってみてください

    $("#content").on('click', 'img', function(){ //try using this way make your code works fine.! });

于 2013-10-04T06:53:28.113 に答える