Неработают скрипты после подгрузки страниц infinitescroll

Тема в разделе "JavaScript", создана пользователем runyugin, 15 июн 2015.

Модераторы: ZiX
  1. runyugin

    runyugin Постоялец

    Регистр.:
    30 июн 2013
    Сообщения:
    54
    Симпатии:
    4
    Подключил плагин подгрузки страниц infinitescroll

    http://allwheelchairs.ru/

    Код:
        jQuery(function ($) {   
           
            $('.items-col-4').infinitescroll({
                navSelector      : ".pagination .next:last",
                nextSelector     : ".pagination a.next:last",
                itemSelector     : ".items-col-4",
                debug             : true,
                dataType         : 'html',
        //        prefill            : true,
        //        path: ["http://nuvique/infinite-scroll/test/index", ".html"]
        
                // behavior        : 'twitter',
                // appendCallback    : false, // USE FOR PREPENDING
                // pathParse         : function( pathStr, nextPage ){ return pathStr.replace('2', nextPage ); }
            }, function(newElements, data, url){
                //USE FOR PREPENDING
                // $(newElements).css('background-color','#ffef00');
                // $(this).prepend(newElements);
                //
                //END OF PREPENDING
        
        //        window.console && console.log('context: ',this);
        //        window.console && console.log('returned: ', newElements);
               
            });
           
           
        
           
           
        });   
            </script>
    В teaser.php выводиться элемент jbimage в котором прописан скрипт:

    Код:
    <script>
        jQuery(function($){
        $("#quickview-<?php echo $quickview; ?>").fancybox({"type":"iframe","fitToView":true,"width":"900","height":400,"autoSize":"true","iframe":{"scrolling":"no","preload":true},"closeClick":false,"title":false,"helpers":{"overlay":{"locked":true}}});
        });
    </script
    но он выводиться у первых 8 ми загруженных товаров до срабатывания infinitescroll

    2015-06-15 12-36-06 Скриншот экрана.png

    Как заставить работать скрипты после скроллинга.
     
  2. Black Hat

    Black Hat Постоялец

    Регистр.:
    15 май 2015
    Сообщения:
    114
    Симпатии:
    76
    $("#quickview-<?php echo $quickview; ?>").fancybox
    это срабатывает на отобранных элементах к моменту domready - так работают селекторы jq. соответственно для новых элементов это не работает, так как они только что созданы, и на них ничего не повешено. тут либо заново делать инициализацию типа $("#quickview-<?php echo $quickview; ?>").fancybox - вставить этот кусок как коллбак - это походе в место где function(newElements, data, url), либо прописать элементам класс "myimages" и делегировать обработку событий типа $("body").on("click", ".myimages", function(){ тут что делать при нажатии, надо посмотреть ману фансибокса как показывать сразу попап})
     
    BaBL нравится это.
  3. BaBL

    BaBL Постоялец

    Регистр.:
    13 ноя 2012
    Сообщения:
    144
    Симпатии:
    87
    Только вместо того чтобы глобальное событие вешать, которое будет кликаться и проверяться на каждом элементе, я бы ставил локальные на myimages:

    $('.myimages').unbind('click').bind('click', function() {});

    последней строчкой в function(newElements)

    unbind позволяет избежать повторного отслеживания клика на ранее загруженных элементах.
     
    Black Hat нравится это.