ajax调用的多请求问题

Multiple requests issue with ajax calls

本文关键字：请求 问题 调用 ajax      更新时间：2023-09-26

我有一个与ajax调用相结合的多选项卡功能。

show.html.erb

<a href="#tabs-2A<%= id %>"> # dynamically generated tabs within loop 

$.ajax({
    type: "GET",
    url: "/controller1/method1",
    dataType: "html",
    data: {  },
    success: function (html) {
        $(element).find("#id").append(html);
    }
});

OnClick在任何这些选项卡触发ajax调用。注:我上面用的是append

partial被附加，类似于实际的

<td><input type="checkbox" data-some_id="<%= @object.id %>", id="dots"/></td>

JS . 

$('body').on("click", "#dots", function(){
   $.ajax({
    var some_id = $(".dot-checked").data('some_id');
    type: "GET",
    url: "/controller1/method2",
    dataType: "json",
    .....
   });
});

所以你可以看到在这个部分中有ajax调用。

一切正常

,

我遇到了多个请求问题(onclick为复选框)，当你点击同一标签多次或即使我们点击其他标签。

这是因为每次部分页面请求都会添加脚本。

重复请求数(/controller1/method2)等于tab被点击的次数

我该怎么克服?

如果不清楚，请随意评论

解决这个问题的一种方法是在AJAX调用进行时防止复选框被单击两次。由于您正在使用复选框，因此通常最好使用change事件处理程序，而不是click。此方法将禁用复选框，直到AJAX调用完成。

$("#dots").on("change", function(){
   $(this).prop('disabled', true); // disable on click/change
   $.ajax({
    type: "GET",
    url: "controller/method",
    dataType: "json",
    complete: function() {
        $('#dots').prop('disabled', false); // re-enable after AJAX is complete
     }
   });
});
相关文章：