Forums Forums Search & Filter Pro Problem with javascript in ajax loaded content

Viewing 3 posts - 1 through 3 (of 3 total)
  • Anonymous
    #243000

    Hi Trevor,

    I’m facing a new problem after installing the beta version on your advice ( see this tread : https://support.searchandfilter.com/forums/topic/double-results-in-firefox-safari-after-using-page-back/ )

    I have some javascript running for every post ( dynamically loading an iframe after clicking the play button on a post ).

    I use this script:
    https://www.labnol.org/internet/light-youtube-embeds/27941/

    Now, the script is only working on the first 6 posts ( which are loaded instantly).
    When scrolling down, more posts are loaded (infinite scroll) but the script is not loaded anymore.

    This was the case when using the 2.5 version of the plugin..

    Can you help me with this?

    My complete script:

    <script type="text/javascript">
    
        document.addEventListener("DOMContentLoaded",
    
            function () {
    
                var div, n,
    
                    v = document.getElementsByClassName("responsive-embed");
    
                for (n = 0; n < v.length; n++) {
    
                    div = document.createElement("div");
    
                    div.setAttribute("data-id", v[n].dataset.id);
    
                    div.innerHTML = labnolThumb(v[n].dataset.id);
    
                    div.onclick = labnolIframe;
    
                    v[n].appendChild(div);
    
                }
    
            });
    
        function labnolThumb(id) {
    
            var thumb = '<div class="wrapper" id="wrapper"></div>',
    
                play = '<div class="play"></div>';
    
            return thumb.replace("ID", id) + play;
    
        }
    
        function labnolIframe() {
    
            var iframe = document.createElement("iframe");
    
    //                                            var embed = "https://www.youtube-nocookie.com/embed/ID?autoplay=1&?rel=0&modestbranding=0";
    
            var embed = "https://player.vimeo.com/video/ID?autoplay=1&title=0&byline=0&portrait=0";
    
            iframe.setAttribute("src", embed.replace("ID", this.dataset.id));
    
            iframe.setAttribute("frameborder", "0");
    
            iframe.setAttribute("allowfullscreen", "1");
    
            iframe.setAttribute("allow", "autoplay; fullscreen");
    
            this.parentNode.replaceChild(iframe, this);
    
        }
    
    </script>
    
    <script src="https://player.vimeo.com/api/player.js"></script>
    Anonymous
    #243024

    Never mind!

    Fixed by wrapping the script in this function:

    jQuery(document).on("sf:ajaxfinish", function(){
    
    //script 
    
       });
    Trevor
    #243058

    Thanks for letting me know. I will close this thread for now.

Viewing 3 posts - 1 through 3 (of 3 total)