jquery history.pushState 스크립트는 처음으로 작동합니다.

Question

아약스를 사용하여 페이지 매김을 시도하고 있습니다. pushState를 사용하여 URL을 업데이트하십시오. 내가 가지고있는 문제는 처음에만 실행된다는 것입니다.

내 전체 설치는이

레일 3.2, jQuery를 다음, 미나리 (매김 보석) 그래서 여기에

내가

jQuery -> 
    $(".pagination a[data-remote=true]").on 'click', (e) -> 
    e.preventDefault() 
    history.pushState {}, '', $(this).attr("href") 

그리고 쇼에 URL

를 업데이트하기 위해 사용하는 코드입니다 .js.erb, 사용하는 콘텐츠를 업데이트하려면

$("#reviews").html('<%= escape_javascript render("review") %>') 
$("#paginator").html('<%= escape_javascript(paginate(@reviews, :remote => true).to_s) %>'); 

쇼는 매번 작동하지만 첫 번째 스크립트는 처음에만 수행합니다.

생성 된 스크립트에 중단 점을 넣으면 스크립트가 처음 호출 될 때 볼 수 있지만 이후에는 호출되지 않습니다. 언 바인딩과 같은 경우가 있습니다.

Answer 1

시도 :

history.pushState 'data', '', $(this).attr("href") 

Answer 2

은 아마 모든 .pagination a[data-remote=true] 링크가 내용이 show.js.erb에 업데이트됩니다 #paginator 컨테이너에 있습니다. show.html.erb에서

: 당신은 [read on documentation for details]

JQuery와 - UJS와

jQuery -> 
    $("#paginator").on 'click', '.pagination a[data-remote=true]', (e) -> 
    e.preventDefault() 
    history.pushState {}, '', $(this).attr("href") 

Answer 3

, 이것은 내가 무엇을 HTML 후 on 방법과 결합을 반복 교체 또는 부모 컨테이너에서 불과 delagate 이벤트 핸들러 필요

show.js.erb에서

<div id="content"> 
    <div class="paginator"> 
    <%= paginate @mydata, remote: true %> 
    </div> 

    <div id="mydata"> 
    <%= render partial: 'mydata' %> 
    </div> 

    <div class="paginator"> 
    <%= paginate @mydata, remote: true %> 
    </div> 
</div> 

:

$('div#mydata').html('<%= j render partial: 'mydata' %>'); 
$('div.paginator').html('<%= j(paginate(@mydata, :remote => true).to_s) %>'); 

in application.js :

$('div#content').on('click', '.pagination a[data-remote=true]', function() { 
    history.pushState(null, '', $(this).attr("href")) 
}); 
$(window).on('popstate', function() { 
    var remoteUrl = "<a href='" + document.location.href + "'" + " data-remote='true'></a>" 
    $.rails.handleRemote($(remoteUrl)); 
});