ajax发送时禁用按钮
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发送时禁用按钮的更多相关文章
- Ajax发送请求等待时弹出模态框等待提示
主要的代码分为两块,一个是CSS定义模态框,另一个是在Ajax中弹出模态框. 查看菜鸟教程中的模态框教程demo,http://www.runoob.com/try/try.php?filename= ...
- 只要发生ajax请求时加载旋转的按钮
定义一个变量 全局 c 只要发生ajax时给c++ 当ajax请求success或者error时,c--; 对加载的按钮添加个事件 监听 c 如果c得值没变化 则隐藏按钮 如果变化了则显示 ...
- ajax 禁用按钮防止重复提交
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- ajax 发送json数据时为什么需要设置contentType: "application/json”
1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别? contentType: "application/j ...
- ajax发送json数据时为什么需要设置contentType: "application/json”
1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别?contentType: "application/js ...
- Ajax发送PUT/DELETE请求时出现错误的原因及解决方案
本文讲什么? 大家应该都知道.在HTTP中,规定了很多种请求方式,包括POST,PUT,GET,DELETE等.每一种方式都有这种方式的独特的用处,根据英文名称,我们能够很清楚的知道DELETE方法的 ...
- AJAX的来龙去脉(由来)-如何被封装出来的--ajax发送异步请求(四步操作)
<黑马程序员_超全面的JavaWeb视频教程vedio\JavaWeb视频教程_day23_ajax> \JavaWeb视频教程_day23_ajax\day23ajax_avi\14.打 ...
- python 全栈开发,Day75(Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件)
昨日内容回顾 基于对象的跨表查询 正向查询:关联属性在A表中,所以A对象找关联B表数据,正向查询 反向查询:关联属性在A表中,所以B对象找A对象,反向查询 一对多: 按字段:xx book ----- ...
- Ajax发送GET、POST请求和响应XML数据案例
1.新建工程 新建一个java web工程,新建一个Servlet文件 AServlet.java,用于返回get和post请求. public class AServlet extends Http ...
随机推荐
- java 下载与配置环境变量
第一:JDK下载 地址:https://www.java.com/zh_CN/download/win10.jsp 注意:自己载点击安装jdk的时候留意一下自己的安装地址,下一步要用: 第二:环 ...
- AngularJS插件使用---angular-cookies.js
首先在项目中引入angular-cookies.js angular模块中添加依赖:‘ngCookies’ 在控制器中依赖注入$cookies,使用$cookies操作cookie $cookiesP ...
- 金三银四科学找工作,用python大数据分析一线城市1000多份岗位招聘需求
文章每周持续更新,各位的「三连」是对我最大的肯定.可以微信搜索公众号「 后端技术学堂 」第一时间阅读(一般比博客早更新一到两篇) 每年的三四月份是招聘高峰,也常被大家称为金三银四黄金招聘期,这时候上一 ...
- Mac 开发工具信息的备份
相信大部分程序员都对开发环境的工具都有一些特殊的执念(???),如果在自己不习惯的环境中工作完全无法开展,怎么这个工具没有那个字体难受,我本人就是,换了新的 Mac 电脑后如何快速恢复到之前的开发工具 ...
- VAuditDemo-文件包含漏洞的审计
包含漏洞 include.require等先关函数,include($file) 文件包含漏洞的问题在于参数可控(路径.文件名.后缀) include($path.$filename.$ext) 包含 ...
- 201771030103-陈正丽 实验一 软件工程准备—<快速浏览 邹欣老师博客—读后感>
项目 内容 <软件工程> 代祖华老师博客 作业要求 邹欣老师博客 学习目标 具体目标 在大概阅读邹欣老师的博客时,发现老师写了关于很多方面的内容,有基础的也有比较深奥的,这次阅读过程中主要 ...
- MTK Android 计算器Calculator输入暗码!77!+,启动工厂测试apk
Android8.0 计算器Calculator输入暗码!77!+,启动工厂测试apk 路径: packages/apps/ExactCalculator/src/com/android/calcul ...
- go 内存优化
一.斐波那切数列优化 package main import ( "time" "fmt" ) const LIM = 41 var fibs [LIM]uin ...
- MySQL入门,第八部分,多表查询(一)
一.数据库脚本 #-------------------------------------------------------------------------------- #--------- ...
- Swing组件中URL方法获取 图标
13.3.2 图标的使用 1.创建图标 package lll; import java.awt.*; import javax.swing.*; public class DrawIcon impl ...