私は、ライトボックスの機能を必要とアヤックスから入ってくるいくつかのリンクを持っている:(ライトボックス)
<a href="..." class="lightbox"><img src='...'></a>
は、通常、これは、ページ上の負荷を経由して動作を与えていますAJAXからのコンテンツであるため、UJSはトリガーされません。
これを行う方法はありますか?
私は、ライトボックスの機能を必要とアヤックスから入ってくるいくつかのリンクを持っている:(ライトボックス)
<a href="..." class="lightbox"><img src='...'></a>
は、通常、これは、ページ上の負荷を経由して動作を与えていますAJAXからのコンテンツであるため、UJSはトリガーされません。
これを行う方法はありますか?
コンテンツがAJAXからのものである場合は、ページのロード中にイベント処理をセットアップしないでください。代わりに、AJAXによって変更または置換されていない一番上のコンテナにイベントをバブルさせます。最悪の場合は、document
を最上位ノードとして使用します。
$('<root element selector>').on('click', 'a.lightbox', function() {
// activate lightbox on the clicked element.
});
私はあなたがAJAXリクエストをトリガしているかどうかはわかりませんが、それは思わjQueryを使っていた場合、あなたは成功コールバックでライトボックスに結合することができます
$.ajax({
url: '/route',
success: function (response, status) {
$('.lightbox').lightbox();
}
});
あなたが渡すことができますがjQueryセレクタとの関連で、すでにページにあるリンクにライトボックスを再接続しないようにします。たとえば、ajax呼び出しでidが 'lightbox_links'のdivにリンクが追加されている場合は、代わりにこのセレクタを使用します。
$('.lightbox', '#lightbox_links').lightbox();