多个ajax请求或一次射门

Question

我遇到了一些设计问题。我有一个带有JQuery日历（完整日历）的页面，我需要根据当前月份检索两个ID。哪一个是最好的解决方案？

1. 每次重新呈现日历（更改月份）时，使用Ajax请求检索ID
2. 加载所有Id（我使用Asp.NetMvc）一次，然后过滤

我尝试使用第一个解决方案，但当用户切换月份过快（例如从1月到2月）时，会影响1月ID到2月，因为用户切换过快（在第一个请求实际完成之前）。

希望我清楚。

提前谢谢。

Answer 1

首选第一种方法。你可以做的是添加一个时间禁用，对我来说，加载器在这种情况下最有用

Css:

body.loading {
overflow: hidden;   
}
body.loading .modal1 {
display: block;
 }
 .modal1 {
 display:    none;
 position:   fixed;
 z-index:    1000;
    top:        0;
     left:       0;
height:     100%;
width:      100%;
background: rgba( 255, 255, 255, .8 ) 
            url('Loaderurl') 
            50% 50% 
            no-repeat;
  }  

查看-将此添加到底部

    <div class="modal1"></div>

脚本-

 $body = $("body");
$(document).on({
    ajaxStart: function () {
        $body.addClass("loading");
    },
    ajaxStop: function (e) { 
       $body.removeClass("loading");
    }
 });

Answer 2

感谢您的帮助。我选择做的是初始化一个数组，在其中我放置了所有需要的ToCancel ajax请求，并创建了一个cancelAjaxRequests方法，每次更改月份时都会调用该方法。

var lastMonthAjaxRequests = [];
lastMonthAjaxRequests.push(... my ajax requests...)
function abortAjaxRequests(ajaxRequests) {
            $.each(ajaxRequests,
                function() {
                    this.abort();
                });
        }

然后每次我的日历被重新呈现：

abortAjaxRequests(lastMonthAjaxRequests);
lastMonthAjaxRequests = [];