Question

我正在编写一个网站，它将使用jquery在一个页面上加载所有内容。 Everything函数本身工作正常，但是当我开始导航，从而一个接一个地调用load函数时，每个实例都会慢一点，直到页面完全崩溃。

这是ajax的结构性问题（我想不是，但谁知道？）或者我做错了什么？

我有时在加载函数中有回调函数，但它们也可以正常工作。

修改的

好吧，我只是想知道它是什么常见的东西，但显然它不是，所以我会告诉你一些代码：

// click and load part
$("#about").click(function(){   
    $("#c1").load('<?php echo get_site_url(); ?>/?page_id=5', 
        layout();
    });
});

//callback function, basically some css injection
function layout() {
        windowHeight = $(window).height();
        $(".column-content").css('height',windowHeight-(containerTop+20)+'px');
        $(".column-content_mode").css('height',windowHeight-(containerTop+60)+'px');
        $(".container-column").css('height',windowHeight-(containerTop+20)+'px');
}

所有内容都包含在$(document).ready({ //all the js });中非常感谢你干预的快速。

Answer 1

不看你的代码，我可以告诉你这个问题最常见的原因：

$(function() {
    $('#target').load('/your/url', function() {
        $('.someclass').click(function() {
            // Click handler for the new elements you just added
        })
    });
});

这里的问题是，您不仅要将处理程序添加到刚加载的新元素中，而且还要为页面上的所有现有元素添加处理程序。它以指数方式复合！

要解决此问题，请使用on方法添加处理程序一次，然后它会自动为新元素添加它们。

$(function() {
    $('#target').on('click','.someclass',function() {
        // Click handler for the new elements you will add in the future
    });
    $('#target').load('/your/url', function() {
        // Nothing to do here now
    });
});

修改

$("#about").click(function(){ $("#c1").load('<?php echo get_site_url(); ?>/?page_id=5', layout(); }); });

load的第二个参数应该是函数引用。摆脱那里的()所以你不要立即调用该函数。您只想传递名称，而不是执行它。此外，您的}无与伦比。在这里仔细检查。

Answer 2

好吧，好吧。事实证明，失败是由js以递归方式加载自身引起的。我错误地这样做是因为我希望每次发生ajax事件时都要刷新它。

使用$('#id').live('click', function(){...});代替$('#id').click(function(){...});，我可以正确地刷新js，并且没有任何延迟。

感谢大家的帮助！

jQuery load（）函数累积延迟直到失败

2 个答案: