1

jQueryのload()関数を使用して、別のファイルから現在のファイル内のdiv要素にコンテンツを読み込もうとしています。特別なことは何もありません。ロードするだけで、それだけです。ただし、ロードされたファイルに含まれているリンクは「無効」になり、クリックできなくなり、:hoverなどの疑似クラスも省略されているように見えます。これに対する解決策はありますか?

$(document).ready(function() {
    $("div.content").load("content.html");
});

content.htmlに次の行だけが含まれているとします。

<a href="somelink.html">xxx</a>

リンクにロードされている場合<div class="content">、リンクはクリックできません。cssに従って色付けされますが、:hover効果は機能せず、リンクではなく通常のテキストのように動作します。ロードしようとしているコンテンツにはいくつかのリンクがあり、load()された後はどれも機能しないため、これは問題です。

4

1 に答える 1

0

私はあなたの問題は次のとおりだと思います:

  • $('div.content')。load('content.html')を使用して、コンテンツのリクエストを(後で)DOMに挿入するように送信します。
  • 次に、$(document).click、$(document).bindなどを使用してノードのハンドラーを指定するコードを実行しますが、このコードは、新しいノードがDOMに追加される前に実行されます。
  • .load呼び出しが完了すると、新しいノードが追加されます。
  • すべての元のノードで定義した動作は、新しいノードでは実行されていません。

それがあなたが説明している問題である場合、新しいノードが作成されたら、すべて同じバインディングを新しいノードに追加する必要があります。

つまり、新しい要素にバインディングを追加するためのコールバックを提供する必要があります。

function on_data_loaded() {
    $('div.content ...').hover(.....);
    // etc.
}
$('div.content').load('content.html', null, onloaded);

(これは特にクリーンな方法ではありませんが、何をする必要があるかを説明する必要があることに注意してください)。

于 2012-09-14T16:24:48.500 に答える