0

jQueryプラグインのeasytabsを使用して、別のページからHTMLをロードしています。HTMLはjQueryフレックススライダーで構成されている場合がありますが、JavaScriptが既に実行されているため、スライダーはロードされた後は機能しません。これが私のコードです：

<ul class="portfolio-thumbnails">
    <li><a href="portfolio.html #item1" data-target="#item1">Load via ajax</a></li>
</ul>

<div class="panel-container">
    <div id="item1" class="portfolio-item"></div> /* The slider loaded from the ajax call will be appended to this div */
</div>

次のように、[ajax経由でロード]リンクをクリックしたときにフレックススライダーを呼び出してみました。

$(".portfolio-thumbnails li a").click(function () { 
    $('.flexslider').flexslider({
        animation: "slide"
    });
});

...しかし、それは私がクリックしたときに2回目だけ機能します。flexsliderスクリプトは、ajaxを介してHTMLをロードする前に呼び出されていると思います。また、外部ページ（portfolio.html）からflexsliderスクリプトを呼び出してみましたが、機能しません。

何か案は？

4

1 に答える 1

1

successイージータブajaxリクエストのコールバックに入れてもらえますか？easytabイベントに以下を追加します。

  .bind('easytabs:ajax:complete', function() {
    $('.flexslider').flexslider({
        animation: "slide"
    });
  });

ドキュメントのイベントフックの下にあります：

タブクリック後にロードしないことへの応答

ここに画像の説明を入力してください

于 2012-12-15T11:51:39.267 に答える