【当服务器超载时，会出现提交卡顿的现象，但是用户在操作时，会不停重复点击提交，会造成服务器压力更大。所以我们需要进行限制】

[1]将提交按钮禁止

<html>

　　<head>

　　　　<script>

　　　　　　//禁止默认行为   因为这里要模拟服务器超载的时候，所以需要先禁止掉submit按钮自动提交的功能

　　　　function preventDef(event){

　　　　　　event=event||window.event;

　　　　　　if(event.preventDefault){

　　　　　　　　return event.preventDefault;

　　　　　　　　}else{

　　　　　　　　　return event.returnValue=false;

　　　　　　　　}

　　　　　　}

　　　　window.onload=function(){

　　　　var form=document.getElementsByTagName('form')[0];　　　　　　//获取到form元素

　　　　var txt=form.elements['txt'];　　　　　　　　　　　　　　　　　　　　//获取到name属性为txt的表单元素

　　　　var sub=form.elements['sub'];　　　　　　　　　　　　　　　　　　　　//获取到name属性为sub的表单元素

　　　　form.onsubmit=function(event){　　　　　　　　　　　　　　　　　　//创建一个提交事件，因为submit是form来提交事件的，所以我们要禁止也需要通过form来禁止

　　　　　　event=event || window.event;　　　　　　　　　　　　　　　　　　

　　　　　　preventDef(event);　　　　　　　　　　　　　　　　　　　　　　//禁止掉默认提交行为

　　　　　　sub.disabled=true　　　　//第一种就是在用户提交完之后，将按钮禁用不再让用户提交，等待提交完毕之后再释放按钮

　　　　　　

　　　　　　setTimeout(function(){　　　　　　　　　　　　　　　　　　　　//模拟5秒钟后再提交

　　　　　　form.submit()},5000);

　　　　}

}

　　　　</script>

　　</head>

　　<body>

　　　　<form id="form">

　　　　　　<input type="text" id="txt" name="txt">

　　　　　　<input type="submit" id="sub">

　　　　</form>

　　</body>

</html>

-------------------------------------------------------------------------------------------------------

[第二种 创建一个变量进行判断]

[1]将提交按钮禁止

<html>

　　<head>

　　　　<script>

　　　　　　//禁止默认行为   因为这里要模拟服务器超载的时候，所以需要先禁止掉submit按钮自动提交的功能

　　　　function preventDef(event){

　　　　　　event=event||window.event;

　　　　　　if(event.preventDefault){

　　　　　　　　return event.preventDefault;

　　　　　　　　}else{

　　　　　　　　　return event.returnValue=false;

　　　　　　　　}

　　　　　　}

　　　　window.onload=function(){

　　　　var form=document.getElementsByTagName('form')[0];　　　　　　//获取到form元素

　　　　var txt=form.elements['txt'];　　　　　　　　　　　　　　　　　　　　//获取到name属性为txt的表单元素

　　　　var sub=form.elements['sub'];　　　　　　　　　　　　　　　　　　　　//获取到name属性为sub的表单元素

　　　　var  flag=true;　　　　　　　　　　　　　　　　　　　　　　　　　　　　//先创建一个变量，表示默认的时候用户还没点击提交

　　　　form.onsubmit=function(event){　　　　　　　　　　　　　　　　　　//创建一个提交事件，因为submit是form来提交事件的，所以我们要禁止也需要通过form来禁止

　　　　　　event=event || window.event;　　　　　　　　　　　　　　　　　　

　　　　　　preventDef(event);　　　　　　　　　　　　　　　　　　　　　　//禁止掉默认提交行为

　　　　　　if(flag==true){

　　　　　　　　　　flag=false;　　　　　　　　　　　　　　　　　　　　//表示用户已经点击过提交按钮

　　　　　　}else{

　　　　　　　　alert('正在提交，请勿重复提交')；　　　　　　　　　　

　　　　　　}

　　　　　　

　　　　　　setTimeout(function(){　　　　　　　　　　　　　　　　　　　　//模拟5秒钟后再提交

　　　　　　form.submit()},5000);

　　　　}

}

　　　　</script>

　　</head>

　　<body>

　　　　<form id="form">

　　　　　　<input type="text" id="txt" name="txt">

　　　　　　<input type="submit" id="sub">

　　　　</form>

　　</body>

</html>

JavaScript禁止用户多次提交方法的更多相关文章

  1. javascript —— 禁止通过 Enter 键提交表单

    $('btn').on('keydown', function () { return false; })

  2. Linux—禁止用户SSH登录方法总结

    Linux-禁止用户SSH登录方法总结 一.禁止用户登录 1.修改用户配置文件/etc/shadow       将第二栏设置为"*",如下.那么该用户就无法登录.但是使用这种方式 ...

  3. AJAX提交方法（POST）Demon

    AJAX的POST提交方法,本质上来看和GET差不多,有些细小的区别,POST要提交数据时,需要setRequestHeader()方法来提交HTTP头,然后send()方法中提交数据(格式为:&qu ...

  4. php表单提交方法汇总

    问题:网页上提交表单之后,PHP为什么不能获取提交的内容?然而在老版本的PHP上运行却正常. 新版的PHP已经废弃了原来的表单内容处理方式,即不再把提交的表单的内容直接复制到一个同名变量中.解决办法有 ...

  5. jQuery实现form表单基于ajax无刷新提交方法详解

    本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...

  6. ASP.net 实现禁止用户重复登录

    本文先为大家介绍如何利用缓存Cache方便地实现此功能. Cache与Session这二个状态对像的其中有一个不同之处,Cache是一个全局对象,作用的范围是整个应用程序,所有用户:而Session是 ...

  7. wex5 实战 用户点评与提交设计技巧

    最近遇到很多同学做毕业设计,其中有一项是用户点评与提交.功能并不复杂,同学们又不会,做为一个完整的功能,如果用wex5来设计开发,事半功倍.今天就以景区实战来向大家展示wex5的高效与强大.半天可以设 ...

  8. Javascript常用对象的属性和方法

    javascript为我们提供了一些非常有用的常用内部对象和方法.用户不需要用脚本来实现这些功能.这正是基于对象编程的真正目的. 在javascript提供了string(字符串).math(数值计算 ...

  9. php页面防重复提交方法总结

    1.提交按钮置disabled 当用户提交后,立即把按钮置为不可用状态.这种用js来实现. 提交前 复制代码 代码如下:         $("#submit").attr('di ...

随机推荐

  1. OD调试4--去除NAG窗口

    OD调试4--去除NAG窗口 nag本意是烦人的意思,nag窗口是软件设计者用来时不时提醒用户购买正版的警告窗口.软件设计者可能认为当用户忍受不了试用版中的这些烦人的窗口时,就会考虑购买正式版本. 一 ...

  2. BZOJ4195 NOI2015 程序自动分析

    4195: [Noi2015]程序自动分析 Time Limit: 10 Sec Memory Limit: 512 MB Description 在实现程序自动分析的过程中,常常需要判定一些约束条件 ...

  3. lightOJ1370 欧拉函数性质

    D - (例题)欧拉函数性质 Crawling in process... Crawling failed Time Limit:2000MS     Memory Limit:32768KB     ...

  4. poj2251 三维简单BFS

    D - (热身)简单宽搜回顾 Time Limit:1000MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I64u Subm ...

  5. Facebook公开其Hadoop与Avatarnode代码——有效解决Namenode顽疾

    Google在2004年创造了MapReduce,MapReduce系统获得成功的原因之一是它为编写需要大规模并行处理的代码提供了简单的编程模式.MapReduce集群可包括数以千计的并行操作的计算机 ...

  6. Core Data (2)－备用

    1.Core Data 是数据持久化存储的最佳方式 2.数据最终的存储类型可以是:SQLite数据库,XML,二进制,内存里,或自定义数据类型 在Mac OS X 10.5Leopard及以后的版本中 ...

  7. Java开发工具与程序调试

    开发工具:MyEclipse,Eclipse等. 程序调试:  (1)断点:设置断点是程序调试中必不可少的手段,Java调试器每次遇到程序断点时都会将当前线程挂起,即暂停当前程序的运行.(在Eclip ...

  8. WINDOWS 2012忘记密码之后。。。

    要使用windows server 2012安装DVD,选择光盘引导进入 进入修复系统 选择疑难解答,进入界面 选择命令提示符 切换目录至系统目录 执行move命令 执行 copy命令 重新启动系统, ...

  9. Check iO：初学Python

    The end of other For language training our Robots want to learn about suffixes. In this task, you ar ...

  10. Xming + PuTTY 在Windows下远程Linux主机

    Xming + PuTTY 在Windows下远程Linux主机 一.原理     Linux/Unix的X Window具有网络透明性.X Window系统里有一个统一的Server来负责各个程序与 ...