Ajax全局加载框(Loading效果)的配置$ajaxSetup

本文详细介绍如何使用JQuery全局配置Ajax,包括设置请求前、完成及错误时的回调函数,展示如何通过Layer加载提示框增强用户体验,并提供了一个具体的测试案例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.简单说明:

Jquery全局配置Ajax的方式为:

 $.ajaxSetup({
             beforeSend: function () {
                 //ajax请求之前
             },
             complete: function () {
                 //ajax请求完成,不管成功失败
             },
             error: function () {
                 //ajax请求失败            
             }
 });

2.详细配置

//全局配置

      $.ajaxSetup({

        layerIndex:-1, //保存当前请求对应的提示框index,用于后面关闭使用

        //在请求显示提示框

        beforeSend: function(jqXHR, settings) {

            this.layerIndex = layer.load(1);

        },

        //请求完毕后(不管成功还是失败),关闭提示框

        complete: function () {

            layer.close(this.layerIndex);

        },

        //请求失败时,弹出错误信息

        error: function (jqXHR, status, e) {

          layer.alert('数据请求失败,请后再试!');

        }

      });

3。测试功能代码:

 

 //按钮点击响应

      function btnClick() {

        $.get("data.php", {name: "hangge"}, function(data){

          console.log(data);

        });

      }

 

<body>

    <input type="button" value="请求数据" onclick="btnClick()"/>

  </body>

4.其他配置

特殊Ajax请求如果不想呈现Loading,只需增加:global:false即可

$.ajax({ type: "Get", url: ***********, global: false });

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值