Anchor click doesn’t even work after loading a PJAX page

I have a rather strange problem with the site that I was messing with, and I can’t plunge into the head, which might happen wrong. I use PJAX on the site and I have a div in my body with an id #page-contents.

The code I'm using to configure PJAX is as follows:

<script type="text/javascript">
    $(function(){
        $(document).pjax('a', '#page-contents', {
            fragment: '#page-contents',
            timeout: 2000
        });
    });
</script>

I know that the setting is correct, because I edited the PJAX file to trigger a warning when it changed the contents of my #page-contentsdiv, and I see this warning when I wait (i.e. when clicking links).

I have a navbar on top (boot navbar), and initially I had problems tracking which navbar item will be marked as active. I solved this problem using the following javascript code.

<script type="text/javascript">
    $("a").click(function() {
        $(".navbar-nav li").removeClass("active");

        var nextPage = $(this).attr("href");
        nextPage = nextPage.substring(nextPage.indexOf(window.location.hostname) + window.location.hostname.length);
        switch(true) {
            case nextPage == "/about":
                $("#about-nav").addClass("active");
                break;
            case nextPage == "/contact":
                $("#contact-nav").addClass("active");
                break;
            case nextPage == "/resume":
                $("#resume-nav").addClass("active");
                break;
            case nextPage.indexOf("/projects") != -1:
                $("#projects-nav").addClass("active");
                break;
            default:
                break;
        }
    });
</script>

, , , , div #page-contents, script. , PJAX - , .

, :

  • , , , , , . pjax, , .
  • .

- , script ? , , - .

!

PS: - - , , http://rosshays.me, . ( , .) , , about, , .

+4
1

-

, , ; script , .

.js. script :

$(document).on('pjax:complete', function() {
            $.ajaxSetup({ cache: true});
            $.getScript("YOUR SCRIPT FILE PATH HERE', true);?>");                           
            });

$.getScript javascript/jQuery, , . (: jQuery)

jquery javascript , PJAX.

* : , bootstrap script $.getScript, .

0

Source: https://habr.com/ru/post/1533095/


All Articles