0

リンクをホバリングしているときにフレームにリンクをロードしようとしていますが、機能していません。ページで作成したリンクにこの関数を使用すると機能しますが、動的に作成したリンクで使用すると機能しません。

これはページ上で作成されるデータです

$('#user-tweets').append('<table class="tweets" width="320" border="0"><tr><td rowspan="1">' + 
  user + '</td><td rowspan="1">' + 
  date + '</td></tr><tr><td width="45"><a href="' + 
  profile_img + '"><img src="' + 
  profile_img + '" width="55" height="50"/></a></td><td width="186">' + 
  text + '<p><a href="' + url + '"target="_blank">' + 
  url + '</a></p></td></tr></table><hr>'
);

...そして、この機能を使用して、ホバーしたときにリンクをフレームに開きます。

$("a").hover(
  function() {
    $(this).append($("<iframe src='"+this.href+"'></iframe>"));
  },
  function () {
    $(this).find("iframe:last").remove();
  }
);
4

1 に答える 1

0

を使用して、委任されたイベント ハンドラーを使用する必要があります.on()。

$('#user-tweets').on('mouseenter', "a", function() {
    $(this).append($("<iframe src='"+this.href+"'></iframe>"));
}).on('mouseleave', 'a', function () {
    $(this).find("iframe:last").remove();
});

アイデアは、スクリプトの実行時に既に存在する親要素にハンドラーをバインドすることです。次に、新しいコンテンツでトリガーされたイベントは、DOM ツリーをその親にバブルアップさせ、そこで処理することができます。したがって、特定のセレクターに一致するすべての要素のイベントを、それらがまだ存在しない場合でも処理できます。

于 2012-09-02T09:25:07.170 に答える