레일에서 PJax로 모든 준비된 jQuery 변수로드하기

Question

이 포럼과 인터넷에서 이에 대한 답변을 검색했지만 정확한 해결책을 찾을 수없는 것 같아요/아니면 완전히 이해하지 못했습니다 ...

이전에 간단한 슬라이드 쇼를 제공하는 레일 응용 프로그램을 설치했습니다. 여기에서는 jQuery를 사용하여 컨테이너를 이동하여 다음 '슬라이드'를 표시합니다. 그런 다음 전체 페이지가 아닌 출력을로드하기 위해 pxax를 구현하기로 결정했습니다. 이 모든 jQuery 제외한 잘 작동합니다. 창 = $ (window) 및 div = $ (div)와 같은 것들에 대한 초기 변수는 더 이상 작동하지 않는다는 것을 on() 위임자를 추가하면 이벤트가 다시 발생한다는 것을 알았습니다.

$(function() { 

var presentation_carousel = $('.carousel') 
var carousel_width = $(".slide").length * 700; 
var carousel_max_next = ((carousel_width - 700) * -1); 

var view_window = $(window); 
var nav_collapse = $('div.nav-collapse'); 

presentation_carousel.css('width', carousel_width+"px") 

$('.button_next').on ('click', function(e) { 
    $('.button').animate({ 
     opacity: 0 
    }, 100) 
    presentation_carousel.animate({ 
     'marginLeft' : "-=700px" 
    }, 500, function(){ 
     $('.button').css('display', 'block'); 
     $('#quiz_carousel .button_next').css('display', 'none'); 

     $('.button').animate({ 
      opacity: 1 
     }, 500) 
    }) 
}); 

특히 presentation_carousel div의 동적 크기 조정이 더 이상 발생하지 않습니다. 문서 준비 태그 안에 표준 console.log를 추가하면 더 이상 해고되지 않습니다.

누군가 pjax가 표준 jQuery와 어떻게 작동하는지 설명 할 수 있고 누군가 내 코드로 나를 도울 수 있다면 좋을 것입니다.

나는 내 함수 내부의 변수를 사용하지 않고 대신 dom을 건너므로이 모든 작업을 수행했습니다. 그러나 이것은 약간의 해킹을 느꼈습니다.

presentation_carousel.animate({}) 
// became 
$('.carousel').animate({}) 

어떤 도움이나 조언도 환영합니다. 필자는 Rails를 처음 사용하고 있으며 jQuery를 완전히 고치고 개선하는 방법에 대한 제안을 항상 열어두고 있습니다.

감사합니다

편집 : 레이아웃에 application.html.erb에서 발휘. 이것은 yield가 호출되고 컨테이너 div 안에있는 유일한 장소입니다.

<div class="span9"> 
    <div data-pjax-container> 
    <%= yield %> 
    </div> 
</div> 

Answer 1

내장형 jquery-pjax events이면 충분할 수 있습니다. $(document).on("pjax:end", handler)은 대략 $(document).ready(handler)에 해당합니다. 당연히 초기 페이지로드에 대한 준비 핸들러가 필요합니다. ;)