有时候,我们期望一些提交操作自动增加遮蔽效果,提交成功时自动去除遮蔽。

方案:

  1、 提交前增加遮蔽逻辑,成功后增加去除遮蔽逻辑,但是不够智能

  2、通过ajax拦截,实现自动添加\去除遮蔽效果

ajax拦截实现

$(document).ajaxSend(function(event,xhr,settings){
var keys = 'add|save|submit|update', /* 地址关键字,自行扩展,以竖线分隔 */
regstr = '\\S*('+key+')[A-Za-z0-9-_]*.(do|action)', /* 后缀可以自行调整 */
urlReg = new RegExp(regstr,'gi');
if(urlReg.test(settings.url)){ /* url满足关键字匹配 */
settings.isSave = true; /* 标识是否提交操作 */
$('#mainpage').addClass('loading'); /* 增加遮蔽效果 */
}
}).ajaxComplete(function(event,xhr,settings){
if(settings.isSave) {
$('#mainpage').removeClass('loading');
}
});

提交操作自动遮蔽实现之ajax的更多相关文章

  1. form表单提交和ajax表单提交,关于移动端如何通过软键盘上的【搜索】和【前进】进行提交操作

    [文章来源]由于自己对于form研究甚少,所以一直用的都是AJAX进行提交,这次后台提出要用form提交,顺便深入研究一下:之前在做表单的时候,发现input可以通过设置不同的type属性,调用不同的 ...

  2. laravel基础课程---12、lavarel的ajax操作2(lavarel的ajax使用总结)

    laravel基础课程---12.lavarel的ajax操作2(lavarel的ajax使用总结) 一.总结 一句话总结: 比较简单:就是js请求ajax,然后控制器获取请求参数,返回数据即可 1. ...

  3. ThinkPHP 表单提交操作成功后执行JS操作如何刷新父页面或关闭当前页等操作

    ThinkPHP 表单提交操作成功后执行JS操作如何刷新父页面或关闭当前页等操作 .操作成功后刷新父页面 $this->assign('jumpUrl', "javascript:wi ...

  4. jquery的输入框自动补全功能+ajax

    jquery的输入框自动补全功能+ajax 2017年05月10日 18:51:39 辣姐什么鬼 阅读数:1461 标签: web前端 更多 个人分类: web前端   内容参考网友文章写成,原博的链 ...

  5. Centos7下搭建SVN服务,本地提交代码自动同步到WEB目录

    1.安装SVN服务[root@bogon ~]# yum -y install subversion 2.查看svnserve安装目录[root@bogon ~]# whereis svnserves ...

  6. 使用ajax提交form表单,包括ajax文件上传【转载】

    [使用ajax提交form表单,包括ajax文件上传] 前言 转载:作者:https://www.cnblogs.com/zhuxiaojie/p/4783939.html 使用ajax请求数据,很多 ...

  7. 使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html

    使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },&qu ...

  8. ajax 中操作this,需要先在ajax的外面给this重新定义为_this!!

    //设置为默认收货地址 $(document).on('tap','.right_none',function(){ var _this = $(this); //只有这样定义,在ajax的内部才可以 ...

  9. 【python】-- 协程介绍及基本示例、协程遇到IO操作自动切换、协程(gevent)并发爬网页

    协程介绍及基本示例 协程,又称微线程,纤程.英文名Coroutine.一句话说明什么是协程:协程是一种用户态的轻量级线程. 协程拥有自己的寄存器上下文和栈.协程调度切换时,将寄存器上下文和栈保存到其他 ...

随机推荐

  1. <Numerical Analysis>(by Timothy Sauer) Notes

    2ed,  by Timothy Sauer DEFINITION 1.3A solution is correct within p decimal places if the error is l ...

  2. unittest 出报告 并配合 jenkins,发现有用例错误,但是构建没出现红点 的解决方法

    加了个 判断 测试用例总数 和 测试运行成功数 是否一致的判断,不一致 就断言失败,jenkins哪里是红点

  3. Python——python读取xml实战,作业6(python programming)

    cd_catalog.xml <?xml version="1.0" encoding="ISO-8859-1"?> <!-- Edited ...

  4. vue源码核心部分

    1.模板编译   初始化时做的:template ==parse()==>ASTtree ==generate()==>render函数  ==> mount(调用dom方法) 每次 ...

  5. 涨姿势:Java 分业务、分级别实现自定义日志打印

    自定义日志级别 通常的日志框架都有以下几个级别,从低到高TRACE,DEBUG,INFO,WARN,ERROR,FATAL. 默认情况,假如我们定义日志打印级别INFO,它会把大于等于INFO级别的日 ...

  6. Window10下安装sbt

    参考:https://segmentfault.com/a/1190000002474507 下载:https://dl.bintray.com/sbt/native-packages/sbt/0.1 ...

  7. 自然语言处理(NLP)入门学习资源清单

    Melanie Tosik目前就职于旅游搜索公司WayBlazer,她的工作内容是通过自然语言请求来生产个性化旅游推荐路线.回顾她的学习历程,她为期望入门自然语言处理的初学者列出了一份学习资源清单. ...

  8. C语言的基础输入输出

    首先来整理一下各个数据类型的输入输出格式: 1.char %c 2.int/short int %d 3.long int %ld 4.long long int %lld 5.float %f 6. ...

  9. git 第一次提交代码

    git init git add README.md git commit -m "first commit" git remote add origin https://git. ...

  10. Linux常用基础操作命令大全(超实用精心整理)

    相信大家都对黑客那种只用命令行对电脑操作的风格惊呆了,其实你也可以做到.linux是一款不同于windows的操作系统,而且它是黑客.渗透人员.运维人员等等必会的.如果你想学习,小编下面整理的命令将会 ...