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

[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. C# 窗体程序入门 之计算器

    之前一直在java的B/S,这次被要求做一个C/S,其中客户端主要是界面和socket通信.因为没有使用过C#和Visual Studio的控件编程,先来个HelloWorld. 我的环境是visua ...

  2. win8 Pro 64位在 UEFI模式下Ghost系统 备份 恢复

    一:在win8 安装U 盘中  1. 新建 “Ghost” 文件夹 2. 将下载的Ghost64.exe 文件拷贝到文件夹  二: 启动的时候 按下F12 选择 HDDUSB 1.Windows 安装 ...

  3. 空值排序(oracle/sqlserver)

    oracle认为 null 最大. 升序排列,默认情况下,null值排后面. 降序排序,默认情况下,null值排前面. 改变空值办法: (1)用nvl函数或decode函数将null转换为一特定值 替 ...

  4. nodejs+express Mvc站点

    nodejs+express Mvc站点 像asp.net Mvc一样开发nodejs+express Mvc站点 首先,我是个c#码农.从事Mvc开发已然4个年头了,这两年前端MVC的兴起,我也跟风 ...

  5. [转]学DSP、FPGA、ARM，哪个更有前途？

    1.这世界真是疯了,貌似有人连FPGA原理是什么都不知道就开始来学习FPGA了. 2.DSP就是一个指令比较独特的处理器.它虽然是通用处理器,但是实际上不怎么“通用”.技术很牛的人可以用DSP做一台电 ...

  6. mysql group_concat函数是有长度限制的

    在表关联查询中,特别是一对多关系的表查询中,group_concat函数是很有用的一个函数,帮助我们减少对数据库查询的次数,减少服务器的压力. 但是今天使用group_concat函数查询数据库时,发 ...

  7. 浅谈 qmake 之 shadow build（将源码路径和构建路径分开，一套源码要分别用msvc2008、msvc2008、mingw分别编译又不互相干扰）

    shadow build shadow build 是什么东西?就是将源码路径和构建路径分开(也就是生成的makefile文件和其他产物都不放到源码路径),以此来保证源码路径的清洁. 这不是qmake ...

  8. 《Programming WPF》翻译 第6章 4.应用程序全球化

    原文:<Programming WPF>翻译 第6章 4.应用程序全球化 如果你打算发布你的应用程序到全球各地,你可能需要为不同地区的用户界面准备不同的版本.至少,这需要解决将文本翻译成适 ...

  9. Cmake中的find_package功能

    find_package其实在windows下扮演的角色并不是很重要.在Unix下就非常重要了,find_package可以根据cmake内置的.cmake的脚本去找相应的库的模块,当然,内建了很多库 ...

  10. jquery第六期：位置选择器

    <html> <head> <script type="text/javascript" src="jquery-1.10.1.js&quo ...