•  22-07-2019
  •  | 
  •  

質問

jQuery .loadメソッドを使用してすべてのWebサイトページをロードしようとしているので、私のWebサイトは次のようになります。

<script type="text/javascript">  
  $(function() {
    $('.link').bind('click', function(e) {
            var page = $(this).attr('href');
            $('#site').addClass('loading');
            $('#content').load(page, function (){
            $('#site').removeClass('loading');
    });

    e.preventDefault();
    return false;
  });

<a href="test.php" class="link">Test</a>

このコードでは、class =＆quot; link＆quot;を取得するすべてのリンクdiv #contentにページをロードします。 正常に動作します！問題はありませんが、class =＆quot; link＆quot;を使用すると、test.phpをロードするときにリンク、ボタン、その他何でも、それは機能せず、新しいページは#contentの外にロードされます。

すでに、これを新しくロードされたファイルにコピーしようとしましたが、機能しません。ヒントがありますか？

ありがとう

役に立ちましたか？

解決

これは、イベントをバインドすると、その時点でDOMにある要素にのみイベントがバインドされるためです。そのため、後で新しいイベントを追加しても、以前に添付したイベントにバインドされることはありません。 jQuery 1.3を持っていると仮定すると、 live 。これにより、イベントを現在および将来のすべての要素にバインドできます。すべてのイベントをサポートしているわけではありませんが、 click はサポートしています。

それを念頭に置いて、これを置き換えるだけです：

$('.link').bind('click', function(e) {

これで：

$('a.link').live('click', function(e) {

（可能な場合はタグを指定する方がはるかに効率的であるため、セレクタにa。を追加しました）

jQuery 1.3がない場合は、できるだけ早くアップグレードする必要があります。できない場合は、 livequery プラグインを確認してください。あまりエレガントではありません。または、アクションをバインドして、新しいデータをロードするたびにそれを呼び出す関数を使用することもできます。ただし、すべてを考慮すると、jQueryの live がこれを行うための最良の方法です。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top