javascript - 如果已经触发，则仅触发 Jquery ajax 一次

Question

我的 Ajax 调用遇到一些问题。我正在努力提高我的网站的性能，为此我想做的一件事是仅触发 ajax 一次(如果它们之前已被触发过)，而不是触发它们。

我的一个场景。我有 2 个选择下拉菜单 - 国家和地区。当国家/地区发生更改时，.change 会被触发，从而触发 ajax 来获取所选国家/地区的区域。现在，例如，如果我选择国家印度，Ajax 将被解雇，并将其更改为冰岛，Ajax 将被解雇。现在，如果我将国家/地区改回印度，Ajax 不应被解雇，因为我已经从服务器获取了数据。

代码

$("#select_list_id").change(function(){
    var url = 'ajax.php?val=' + this.value;
    $.ajax({
      url: url,
      success: function(json){
        for(i=0; i<jsonData.length;i++) {
          $("#select_list_2_id").append(new Option(jsonData[i].title,jsonData[i].id));
        }
      }
    });
  })

我的方法可以是存储返回的json，并比较更改时的countryID，如果该值已经存在，则返回json，否则点击Ajax。但我的项目中有近 100 个 ajax 调用，这个过程可能需要一些时间。

如果有人可以帮助我，如何概括这段代码。

除此之外，在搜索时我发现这也可以通过 jquery Once 插件来完成，如果是这样，有人可以提供一些帮助吗？

更新 -谢谢大家，这确实对我有帮助，现在一切都很好:)只是另一个小查询，那么 jquery Once 插件有什么用呢？它用于相同的东西吗？

Answer 1

如果你可以通用化你的ajax调用，你可以通过请求uri(url+params)缓存结果json

像这样:

var ajaxCache = [];

function ajaxCall(url,successFunc)
{
    if(ajaxCache[url] != undefined)
    {
        successFunc(ajaxCache[url]);
    }
    else
    {
        $.ajax({
            url: url,
                success: function(json){
                    ajaxCache[url] = json;
                successFunc(json);
                }
            });
    }
}

$("#select_list_id").change(function(){
    ajaxCall('ajax.php?val=' + this.value, function(json){
        for(i=0; i<jsonData.length;i++) {
            $("#select_list_2_id").append(new Option(jsonData[i].title,jsonData[i].id));
        }
    });
});