javascript - 使用 jQuery 脚本页面加载逐渐变慢

Question

我正在使用这个 jQuery 脚本来显示搜索结果。一切正常，但是当搜索结果超过一页并且我通过分页浏览页面时，每个页面的加载速度都会逐渐变慢。通常我会快速加载大约 10 个页面，但接下来会避免加载延迟。整个网站卡住了一会儿(还有加载程序图像)，但浏览器还没有。应该是什么问题？

function editResults(def) {
    $('.searchResults').html('<p class=\'loader\'><img src=\'images/loader.gif\' /></p>');
    var url = def;
    var url = url + "&categories=";
    // Parse Categories
    $('input[name=chCat[]]').each(function() {    
        if (this.checked == true) {
            url = url + this.value + ",";
        }
    });
    url = url + "&sizes=";
    // Parse Sizes
    $('input[name=chSize[]]').each(function() {    
        if (this.checked == true) {
            url = url + this.value + ",";
        }
    }); 
    url = url + "&prices=";
    // Parse Prices
    $('input[name=chPrice[]]').each(function() {    
        if (this.checked == true) {
            url = url + this.value + ",";
        }
    });
    $('.searchResults').load('results.php'+url);
    $('.pageLinks').live("click", function() {
        var page = this.title; 
        editResults("?page="+page);
    });
}
$(document).ready(function(){
    editResults("?page=1");
    // Check All Categories
    $('input[name=chCat[0]]').click(function() {
        check_status = $('input[name=chCat[0]]').attr("checked");
        $('input[name=chCat[]]').each(function() {    
            this.checked = check_status;    
        });
    });
    // Check All Sizes
    $('input[name=chSize[0]]').click(function() {
        check_status = $('input[name=chSize[0]]').attr("checked");
        $('input[name=chSize[]]').each(function() {    
            this.checked = check_status;    
        });
    });
    // Edit Results
    $('.checkbox').change(function() {
        editResults("?page=1");
    });
    // Change Type
   $(".sort").change(function() {               
        editResults("?page=1&sort="+$(this).val());
   });          
});

Answer 1

$('.pageLinks').live("click", function() {
    var page = this.title; 
    editResults("?page="+page);
});

只是一个疯狂的猜测，但是......这段代码不会向点击事件添加一个新的事件处理程序，而不是用新的事件处理程序替换旧的事件处理程序吗？导致点击调用所有曾经注册的处理程序。

你应该只绑定(bind)一次事件

var global_var = '1';

function editResults(def) {
    // all your code
    global_var = 2; // what ever page goes next
};

$(document).ready(function() {
    // all your code ...
    $('.pageLinks').live("click", function() {
        var page = global_var;
        editResults("?page="+page);
    });
});