博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Javascript在ajax提交过程中页面显示加载中,请等待效果,并在提交过程中限制确定按钮防止多次提交,提交完成后,解除提交限制...
阅读量:4562 次
发布时间:2019-06-08

本文共 1777 字,大约阅读时间需要 5 分钟。

加载中,请等待div:

 

确定重置按钮:
确定
重置
加载中,请等待效果图的CSS样式,设置其至页面中央:
.center-in-center{            position: absolute;            top: 50%;            left: 50%;            -webkit-transform: translate(-50%, -50%);            -moz-transform: translate(-50%, -50%);            -ms-transform: translate(-50%, -50%);            -o-transform: translate(-50%, -50%);            transform: translate(-50%, -50%);        }

ajax提交代码:

$.ajax({          type: 'POST',                  url:   "",                       data:  {},//json数据                    beforeSend:function(XMLHttpRequest){                       $("#load").show();                          $("#conf").removeAttr("onclick");//提交过程中,将确定按钮设置为不可点击(方法1)//              $('#conf').attr('onclick','javascript:void(0);');//将按钮设置为不可点击 (方法2)             },                       success: function(resultMessage){                              $("#load").hide();                            var resultMessage = eval('(' + resultMessage + ')');                       alert(resultMessage.result);                          if(resultMessage.result){                              alert(resultMessage.message);                              $("#conf").attr("onclick","conf();");//提交成功,将按钮设置为可点击                      }else{                              alert(resultMessage.message);                               $("#conf").attr("onclick","conf();");                                            }                            },//                   dataType: dataType                 });
加载中,请等待操作为:在beforeSend中$("#load").show()显示图片,在success中$("#load").hide()隐藏图片即可
按钮提交限制操作:分别在beforeSend中设置按钮不可提交,然后提交成功后在success中再次设置按钮可提交即可
 

 

 

 

转载于:https://www.cnblogs.com/zzmb/p/7727277.html

你可能感兴趣的文章
Learning Python 008 正则表达式-003 sub()方法
查看>>
Linux的虚拟机拷贝到另外的操作系统时,NAT方式的静态IP无效,一直是获取的DHCP动态地址...
查看>>
要检测两个C文件的代码的抄袭情况
查看>>
PHP-多域名单点登陆方案
查看>>
iOS开发之应用内支付IAP全部流程
查看>>
【web技术】html特效代码(一)
查看>>
SWFObject: 基于Javascript的Flash媒体版本检测与嵌入模块
查看>>
高可用集群搭建
查看>>
Lua学习笔记
查看>>
Redis监控工具,命令和调优
查看>>
【Video Tracking & Detection】系列一之Framework(持续更新)
查看>>
[转] 3D算法
查看>>
游戏UI框架设计(二) : 最简版本设计
查看>>
pip不是内部或外部命令也不是可运行的程序或批处理文件的问题
查看>>
Xcode 9,真机测试,App installation failed
查看>>
zabbix-mysql迁移分离
查看>>
jQuery调用WCF 说明
查看>>
算法第5章作业
查看>>
7.9 练习
查看>>
基于ArcGIS JS API的在线专题地图实现
查看>>