0

アセットパイプラインフォルダーのjavascriptファイルに以下の関数があります。このファイルを他のすべてのライブラリの下にあるapplication.jsファイルの要件にロード順に設定しました。ファイルはブラウザに正しくロードされます。

何らかの理由で機能していないので、現在erbファイルに追加して正しく機能していますが、アセットパイプラインでの使用方法を知りたいです。

私はそれを間違って宣言していますか？

 $(function(){

      var $container = $('#container');

      $container.isotope({
        itemSelector: '.element'
      });

    });

これはビューです：

<div id="container" class="super-list width2 height2  clearfix">

    <% @feature.issues.each do |issue| %>
    <div class="element metalloid isotope-item   " data-symbol="Mg" data-category="alkaline-earth">
    <p class="number">  <%= issue.id %> </p>
  <h2 class="symbol"> <%= link_to issue.title, [@feature, issue] %> </h2>

  </div>
  <% end %>

</div>
4

1 に答える 1

3

コメントに基づいて、実行する必要があるのは、このコードをブロック内に配置するのではなく$(function() {})、ロードをトリガーしているものすべてのイベントブロック内に配置する必要があります。pjaxのドキュメントを見ると、かなり明確な答えがあると思います。

https://github.com/defunkt/jquery-pjax

「pjaxは、応答ボディをロードするように要求したコンテナで2つのイベントを発生させます。 」pjax:startと述べていpjax:endます。

したがって、divをendイベントにバインドし、関数を渡せば、機能するはずです。そうでない場合は、ビューコードを投稿することをお勧めします。

編集

私はあなたが近くにいると思います。追加したコードに基づいて、要素にpjaxをバインドする場所にonフラグを付ける必要があります。あなたが投稿した最初の行は次のとおりです。

$('a.pjax').pjax()

私はあなたが以下を試すことができると思っています：

$('a.pjax').pjax().on('pjax:end', function(){ 
  var $container = $('#container'); 
  $container.isotope({ itemSelector: '.element' }); 
});
于 2012-04-21T11:23:55.413 に答える