Question

我遇到了JQuery ajax调用的问题，问题是这样的：

如果我连续多次使用同一个查询，那么每次使用该方法时浏览器都会开始变慢。不知道该怎么说，所以我会举一个例子。

$("#categAdProdIes").on("change",function(){
    var categId=$("#categAdProdIes").val();
    $.ajax({
        type:"GET",
        url:"php/facturi/prodAjax.php",
        data:{categId:categId}
    }).done(function(rez){
            $("#prodAdIes").html(rez);
        });
});

上面的方法（选择菜单使用ajax获取另一个选择菜单中的选项），如果我连续多次使用它，页面会越来越慢，直到冻结。整个项目是一个包含动态内容的Web应用程序（所有内容都通过.ajax（）加载。）

有人可以告诉我为什么会出现这个问题，我该如何解决？

更新＃2：我解决了这个问题，但我不明白为什么。我有一个按钮，它使包含select元素的div可见，我把函数放在该函数中，问题解决但我不知道为什么，所以我将来可以知道。

这是功能：

$("#badProdIes").on("click",function(){
        $(".adaugProdIesForm").css("display","block");
    });

这就是修复它的方式：

$("#badProdIes").on("click",function(){
    $(".adaugProdIesForm").css("display","block");
    $("#categAdProdIes").on("change",function(){
        var categId=$("#categAdProdIes").val();
        $.ajax({
            type:"GET",
            url:"php/facturi/prodAjax.php",
            data:{categId:categId}
        }).done(function(rez){
                $("#prodAdIes").html(rez);
            });
    });
});

Answer 1

可能是ajax缓存问题.. 尝试：

$.ajaxSetup({ cache: false });

Answer 2

这是我目前唯一可以想到的，但是如果你运行这个功能很多我会缓存你的选择器，即使你使用的是id这是一件好事。

var select = $("#categAdProdIes");
var categId = $("#categAdProdIes");
var container = $("#prodAdIes");

select.on("change",function(){
    $.ajax({
        type:"GET",
        url:"php/facturi/prodAjax.php",
        data:{categId:categId.val();}
    }).done(function(rez){
        container.html(rez);
    });
});

不确定会给你多少性能提升，但值得一试，

Answer 3

我已经解决了这个问题，所以我会在这里发布，以防有人遇到同样的问题。这只是因为函数在AjaxComplete下运行，并且有许多查询绑定并使用.off()函数解决它：

$("#badProdIes").off().on("click",function(){
        $(".adaugProdIesForm").css("display","block");
    });

JQuery同样的方法正在减慢浏览器的速度

3 个答案: