pjax.브라우저의 후퇴 단추를 눌렀을 때, js는 내장적으로 불러오지 않습니다

5192 단어 jquery-pjax
안녕하세요.
나는 웹 디자이너이지 개발자가 아니다.나는 이 멋진 극본으로 내가 할 수 있는 대로 해 보려고 했지만, 내가 잘했는지 아닌지는 확실하지 않다.나는 wordpress에 나의 개인 투자조합 사이트를 만들고 pjax를 사용하여div#main 콘텐츠를 불러왔다.
나는 이전에 모든 스크립트

묘사

를 실행한 적이 있다. 먼저 jQuery, 그 다음에 Modernizer, 그리고 PJAX (나는 비HTML5 브라우저를 지원하지 않는다.)
다음은 스크립트를 실행하는 단계입니다.
(function($){
    if ($.support.pjax) {

        // Pjax Params
        function initPjax(nextUrl){
            $.pjax({ 
                url: nextUrl, 
                container: '#main', 
                fragment: '#main',
                timeout:  10000
            });
        }

        // Pjax Init
        $(document).on('click', ".menu a, .logo a, .work-nav a, .footer-links a, a.pjax-link", function(e) {
            e.preventDefault();
            var nextUrl = $(this).attr('href');
            bod.addClass("pjax-loading");

            $pjax_container.velocity({ opacity: 0 }, {
                duration: 200,
                complete: function(){
                    initPjax(nextUrl)
                }
            })
        });

        // Pjax Animation (In)
        $(document).on('pjax:end', function(e) {

            // Workaround to reload inline scripts in page loaded via popstate/pushstate (founded here)
            $(e.target).find('script').each(function() {
                $.globalEval(this.text || this.textContent || this.innerHTML || '');
            })
            $pjax_container.velocity({ opacity: 1 }, { duration: 200 })
        });

    }
})(jQuery);
이 '포럼' 에 세워진 해결 방안 덕분에 (popstate/pushstate를 통해 페이지를 불러올 때 내연 스크립트가 실행되지 않았습니다) 모든 것이 완벽하게 실행될 수 있습니다.
문제는 브라우저의 후퇴 단추를 눌렀을 때 여전히 작동하지 않는다는 것이다.다음 거 아니야.이상해..."Travaux"를 후퇴 단추를 누르면 불러오려고 시도할 때 누르십시오.js가 불러오지 않았습니다.
여기서 보실 수 있습니다.http://proov.fr
만약 누군가가 나를 도울 수 있다면 다행이다:)
감사합니다: </body> 내연 스크립트는 jQuery에서 자동으로 실행해야 합니다. 왜냐하면 pjax는 내부에서 jQuery의

토론 #1

를 사용하여 내용을 바꾸기 때문입니다.pjax 내비게이션이든 '후퇴' 단추든, 이 행동을 얻기 위해 별도의 일을 할 필요가 없습니다.fn.html() 스크립트란 무엇입니까? 왜 이 스크립트를 불러오기를 원합니까?lsotope.js@mislav: 유효하면 안 돼요!나는 jQuery

토론 #2

가 내부에서 사용fn.html()된다고 생각한다. HTML5규범에서 이렇게 말한다.

script elements inserted using innerHTML do not execute when they are inserted.

Source : Footnote of innerHTML paragraph in 2.5.2 Dynamic markup insertion in HTML


@플로프:
나도 이 문제에 부딪혔고 어느 곳에서(본 환매 협의의 다른 버전에서) 해결 방안을 찾았다. 다음은 나의 버전이다.
일반 스크립트 태그 또는 js 파일에 다음을 추가합니다.
  $(function() {
    $(document).on("pjax:popstate", function() 
      $(document).one("pjax:end", function(event) {
        $(event.target).find("script[data-exec-on-popstate]").each(function() {
          $.globalEval(this.text || this.textContent || this.innerHTML || '');
        })
      });
    });
  });
다음에 인라인 innerHTML 표시를 사용할 때, 후퇴/다음 단추를 눌렀을 때, 스크립트 표시에 <script> 를 추가하면 됩니다.
    <script data-exec-on-popstate>
        alert("Hello, I'm seen every time the page load")
    </script>

    <script>
        alert("Hello ! I'm only seen the first time the page is loaded")
    </script>
data-exec-on-popstate@PofMagicfingers jQuery는 위 코드와 같은 동작을 자동으로 실행합니다:

토론 #셋

에서 내연 스크립트 표시를 교체하고 평가합니다..html(content)@mislav:Yup, 그러나 팝업 상태가 뜨면 작동하지 않습니다. jQuery가 실행된 것으로 표시하기 때문입니다. See this line

토론 #4

+1

토론 #5

+1

토론 #6

@PofMagicfingers의 힌트 감사합니다!나도 생각 못했을 거야.

토론 #7

천만에요.

토론 #8

jQuery 2.1.4와 최신 pjax를 사용하면 글로벌Eval이false로 설정되었음에도 불구하고 이 문제가 존재합니다.이것은 불러오는 첫 페이지에서만 발생한다.[뒤로] 버튼이 로드된 나머지 페이지는 정상적으로 작동합니다.
@mislav@PofMagicfingers를 방주로 하고 jQueryis going to drop _data와 디테일을 숨깁니다.그래서 미래에 깨질 수도 있어!
//  Implementation Summary
//
//  1. Enforce API surface and semantic compatibility with 1.9.x branch
//  2. Improve the module's maintainability by reducing the storage
//      paths to a single mechanism.
//  3. Use the same single mechanism to support "private" and "user" data.
//  4. _Never_ expose "private" data to user code (TODO: Drop _data, _removeData)
//  5. Avoid exposing implementation details on user objects (eg. expando properties)
//  6. Provide a clear path for implementation upgrade to WeakMap in 2014

좋은 웹페이지 즐겨찾기