beforeSend方法的用户主要有下面几个:
第一:用于在发送ajax请求之前设置请求头
即作为前端,如果我们希望在发送数据之前设置请求头,就可以像下面这么做:
beforeSend: function(request) { request.setRequestHeader("BBG-Key", "ab9ef204-3253-49d4-b229-3cc2383480a6");},
第二:防止数据重复
当用户提交表单时,虽然有时候已经点击了提交按钮,但是由于网络原因,会出现暂时没有返回数据等情况,用户会认为没有点击成功,就会造成数据库中产生多条重复的数据---脏数据,所以我们可以在beforeSend中添加禁用提交按钮的功能,在complete后在恢复之,如下:
// 提交表单数据到后台处理$.ajax({ type: "post", data: studentInfo, contentType: "application/json", url: "/Home/Submit", beforeSend: function () { // 禁用按钮防止重复提交 $("#submit").attr({ disabled: "disabled" }); }, success: function (data) { if (data == "Success") { //清空输入框 clearBox(); } }, complete: function () { $("#submit").removeAttr("disabled"); }, error: function (data) { console.info("error: " + data.responseText); }});
第三: 模拟toast效果
ajax请求服务器加载数据列表时提示loading(“加载中,请稍后...”)
$.ajax({ type: "post", contentType: "application/json", url: "/Home/GetList", beforeSend: function () { $("loading").show(); }, success: function (data) { if (data == "Success") { // ... } }, complete: function () { $("loading").hide(); }, error: function (data) { console.info("error: " + data.responseText); }});