css

/*div无法点击*/
.div-cant-click {
pointer-events: none;
}

发送ajax实例

$.ajax({
url:'url',
type:'post',
dataType:'json',
data:{
dataName:dataValue
},
success:function (res) {
// 提示插件
toastr.options = {
"closeButton": false,
"debug": false,
"positionClass": "toast-top-left",
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "5000",
"extendedTimeOut": "1000",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut"
}
switch(parseInt(res.code)){
// 失败
case 400:
toastr.error(res.msg)
// 失败则使按钮可点击
$("#id").removeClass("div-cant-click")
break;
// 成功
case 200:
console.log(res.msg)
break;
}
}
,beforeSend:function () {
// 禁用按钮,防止发送多次ajax
// 在发送请求之前禁止按钮
$("#id").addClass("div-cant-click")
}
})

除此之外,还可以在发送请求之前定义一个lock=true,然后判断lock是否为true,为true则进行ajax请求,同时将lock设置为false,在请求完毕设置为true

ajax发送时禁用按钮的更多相关文章

  1. Ajax发送请求等待时弹出模态框等待提示

    主要的代码分为两块,一个是CSS定义模态框,另一个是在Ajax中弹出模态框. 查看菜鸟教程中的模态框教程demo,http://www.runoob.com/try/try.php?filename= ...

  2. 只要发生ajax请求时加载旋转的按钮

    定义一个变量 全局 c 只要发生ajax时给c++ 当ajax请求success或者error时,c--; 对加载的按钮添加个事件   监听 c  如果c得值没变化  则隐藏按钮   如果变化了则显示 ...

  3. ajax 禁用按钮防止重复提交

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. ajax 发送json数据时为什么需要设置contentType: "application/json”

    1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别? contentType: "application/j ...

  5. ajax发送json数据时为什么需要设置contentType: "application/json”

    1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别?contentType: "application/js ...

  6. Ajax发送PUT/DELETE请求时出现错误的原因及解决方案

    本文讲什么? 大家应该都知道.在HTTP中,规定了很多种请求方式,包括POST,PUT,GET,DELETE等.每一种方式都有这种方式的独特的用处,根据英文名称,我们能够很清楚的知道DELETE方法的 ...

  7. AJAX的来龙去脉(由来)-如何被封装出来的--ajax发送异步请求(四步操作)

    <黑马程序员_超全面的JavaWeb视频教程vedio\JavaWeb视频教程_day23_ajax> \JavaWeb视频教程_day23_ajax\day23ajax_avi\14.打 ...

  8. python 全栈开发,Day75(Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件)

    昨日内容回顾 基于对象的跨表查询 正向查询:关联属性在A表中,所以A对象找关联B表数据,正向查询 反向查询:关联属性在A表中,所以B对象找A对象,反向查询 一对多: 按字段:xx book ----- ...

  9. Ajax发送GET、POST请求和响应XML数据案例

    1.新建工程 新建一个java web工程,新建一个Servlet文件 AServlet.java,用于返回get和post请求. public class AServlet extends Http ...

随机推荐

  1. flask前后端输出html页面(数组遍历)

    通过flask,输出页面 后端代码文件:app.py 前端html文件:output.html 1.打开(app.py) 导入相关模块: 2.定义方法:(app.py) 3.写入与后端定义好的参数:( ...

  2. Material Design 组件之 AppBarLayout

    AppBarLayout 是一个垂直方向的 LinearLayout,它实现了许多符合 Material Design 设计规范的状态栏应该具有的功能,比如滚动手势. AppBarLayout 一般直 ...

  3. Python数据库之数据操作

    一 介绍 MySQL数据操作: DML ======================================================== 在MySQL管理软件中,可以通过SQL语句中的 ...

  4. Mitmproxy 安装

    Mitmproxy Python 安装步骤 官方文档 安装mitmproxy 在cmd中输入 pip install mitmproxy 安装完成后,在cmd中输入 mitmdump(windows不 ...

  5. js 实现浏览器全屏效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. C++ delete报错解析

    C++ delete报错 今天写了如下代码 #include <iostream> #include <algorithm> using namespace std; int ...

  7. 从零搭建一个SpringCloud项目之Zuul(四)

    整合Zuul 为什么要使用Zuul? 易于监控 易于认证 减少客户端与各个微服务之间的交互次数 引入依赖 <dependency> <groupId>org.springfra ...

  8. MySQL InnoDB存储引擎体系架构 —— 索引高级

    转载地址:https://mp.weixin.qq.com/s/HNnzAgUtBoDhhJpsA0fjKQ 世界上只两件东西能震撼人们的心灵:一件是我们心中崇高的道德标准:另一件是我们头顶上灿烂的星 ...

  9. easy-mock 本地部署(挤需体验三番钟,里造会干我一样,爱象节款mock)

    前言 很多小伙伴问我怎么在自己公司的项目里面添加配置mock,在vue项目里面都知道怎么配置mock,在大型前端项目里面就一脸疑惑了. 我就回答他,你今天会在vue项目里面用,那天换公司是用angul ...

  10. 33.1 File 获取目录下的所有文件及子目录

    重要获取功能 String[] list() 返回当前路径下所有的文件和文件夹名称 //注意:只有指向文件夹的File对象才可以调用该方法(指向文件的file对象使用list会报错npe) File[ ...