zoukankan      html  css  js  c++  java
  • jquery中ajax发送请求时关于beforesend和complete的用法

    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);
        }
    });
  • 相关阅读:
    LeetCode 485. Max Consecutive Ones
    LeetCode 367. Valid Perfect Square
    LeetCode 375. Guess Number Higher or Lower II
    LeetCode 374. Guess Number Higher or Lower
    LeetCode Word Pattern II
    LeetCode Arranging Coins
    LeetCode 422. Valid Word Square
    Session 共享
    java NIO
    非阻塞IO
  • 原文地址:https://www.cnblogs.com/webmc/p/11403734.html
Copyright © 2011-2022 走看看