Rails PJAXとTwitter Bootstrapプラグインがうまくいきません

Question

こんにちは、私はRails PJAXを使って、TwitterアプリケーションのJitterプラグインを使っています。私は彼らの両方を一緒に働かせるように見えることはできません。したがって、例として、ページネーションがあり、いくつかの要素にいくつかのホバー効果があります。

最初にページをリロードし、すべてのページにカーソルを移動したときに機能します。ページネーム上の次のページをクリックすると、ページの日付が上がり、次に移動すると機能しません。論理的には、DOMは既にロードされていたので、私は思っていました。私に何ができる？

Rails PjaxをRails 3.2アプリケーションで使用すると、PjaxのアプリケーションにJqueryを書く必要がなくなりました。

https://github.com/nz/pjax-rails http://twitter.github.com/bootstrap/javascript.html#popovers

は解決：使用：私は実際に

$(document).on('ready ajaxComplete', function() { 
    $('a').popover() 
}); 

Answer 1

ショートバージョンで問題を解決し

新しい要素にブートストラップ動作を適用するためのpjax：endイベント。

pjaxが新しいコンテンツを読み込むと、ブートストラップハンドラはすべての要素にバインドされていません。典型的なjQuery要素では、「ライブ」を使用してjQueryに新しいコンテンツを検出させ、正しいハンドラを適用させることができます。申し訳ありませんが、この最初の部分が既に知っているものです。例えば

これはあなたのjQueryのレディ機能である場合：

$('a').click(function() { alert('here') } 

あなたが動的に別のアンカー要素を含むコンテンツを読み込む場合は、クリックハンドラは、それに結合されることはありません。

しかし、あなたはこれを行う場合：新しいコンテンツがロードされたとき、それがライブ使用してバインドされているため

$('a').live('click', function() { alert('here') } 

、jQueryのクリックハンドラを追加します。戻るブートストラップへ

。ポップオーバーのようなものについては、私が知る限り同等の「生きている」方法はありません。これに

$('a').popover() 

：あなたはこの変更することはできませんアンカーがpjax（またはAJAXまたは動的なもの）を介してロードされているのであれば

$('a').live('popover') # WON'T WORK 

を、新たなアンカーはpopoversとしてバインドされていません。 pjax内容が挿入された後、あなたがものを行うことができますので、終了イベント：

それを回避する方法は、それがpjaxをバインドすることです。ポップオーバーの例では：

$(document) 
    .on('pjax:end', function() { $('a').popover() }) 

pjaxコンテンツがロードされるたび、それはその機能を実行し、新たに挿入されたものを含む任意のアンカー要素にポップオーバー機能を適用します。セレクタを介して新しいコンテンツのコンテナだけにさらに分離することができ、変更されていないものに機能を再適用する必要はありません。