0

我无法让 jQuery 在 .load() 函数中工作。

该脚本将指定的页面内容加载到#project div中，然后初始化flexslider，它工作正常。

问题是，我正在尝试添加箭头以导航到下一篇/上一篇文章，但当然，如果我将箭头的 .load 函数放在下面的第一个 .load 函数之外，则代码将不起作用。

我也尝试将它们放在下面的 .load 函数中，并且在第一篇文章中效果很好。之后，所有的 jQuery 都停止了初始化（flexslider，甚至左/右箭头单击功能）。

就像我必须做一个无限的 .load() 循环或其他东西。我希望我是有道理的，希望有人可以提供帮助。这就是我所拥有的，减去箭头。

总结一下这个问题.. 无论如何让 jQuery 在 .load() 函数中工作而不在 .load() 中重新初始化它？

jQuery('.single-item, .portfolio-images article').click(function() {
    var geturl = window.location;
    var next_project = jQuery(this).attr('data-projectid');
    jQuery('html, body').animate({ scrollTop: 0 }, 500);
    jQuery('#project').slideUp('slow');
    jQuery('#project').load(geturl + "?page_id=" + next_project + " .project", function() { 
        if (jQuery(this).hasClass('opened')) {
            jQuery(this).slideDown(600);
            jQuery('.flexslider').fadeIn();
        } else {
            jQuery(this).slideDown(300);
            jQuery('.flexslider').fadeIn();
        }
        jQuery('.grid').click(function() {
            jQuery('#project').slideUp(500);
        });
        // Initialize Scripts
        jQuery('.flexslider').flexslider({
            animation: "slide",
            smoothHeight: true,
            startAt: 0,
        });
    });
    }).addClass('opened');
    return false;
4

2 回答 2

0

由于内容是动态加载的，您可能必须使用带有选择器的 on() 方法，即类似于以下内容： $( document ).on(EVENT, SELECTOR ,function(){});

Jquery 事件处理程序不适用于动态内容

另见http://learn.jquery.com/events/event-delegation/

于 2013-09-26T03:36:20.670 回答
0

事件的问题，您可以在加载之前添加事件。

就像：

$(document)
    .on("click", ".your-elements", function ()
    {
        alert("code here");
    });

插件调用也是一样，如果你不能在加载之前调用插件构造函数，也许你需要调用一个“销毁”函数并再次构造插件。

例如看这个小提琴

于 2013-09-26T04:49:47.083 回答