预防重复提交JS-提交按钮自动变灰
发布时间：2022-04-18 10:06:39 所属栏目：经验 来源：互联网
导读：防止重复提交JS-提交按钮自动变灰： 第一种方法：直接按钮中加入 当点击提交后，提交按钮变灰色不可用，这样可有效防止重复提交，本代码就是实现这样一个功能。从代码就可以看出，我们只需在提交按钮上加入这一句： onclick=javascript:{this.disabled=true;
|
防止重复提交JS-提交按钮自动变灰： 第一种方法：直接按钮中加入 当点击提交后，提交按钮变灰色不可用，这样可有效防止重复提交，本代码就是实现这样一个功能。从代码就可以看出，我们只需在提交按钮上加入这一句： onclick="javascript:{this.disabled=true;document.form1.submit();}"，意思是当按钮点击后，将按钮的不可用属性设置为true，这样按钮就变灰了 <form name=form1 method="POST" action="/" target=_blank> <p><input type="text" name="T1" size="20"><input type="button" value="提交" onclick="javascript:{this.disabled=true;document.form1.submit();}"> <input type="reset" value="重置" name="B2"></p> </form> 或 （一般用下面这个就行了） <input name="Submit" type="submit" name="addnews" class="input_sub" value="提 交" onClick="this.disabled=true;document.add.Submit.value='提交中...';document.add.submit();"> 提交后提交按钮边灰不可重复点击，这样可避免重复提交 防止重复提交js按钮变灰 第二种方法：通过onSubmit事件实现，并且可以将变灰按钮变为可用 在form里面添加 onSubmit事件，如果表单加入了判断，那么这个方法直接就可以用了，记住就放到最后，否则一开始就为灰了，但我们加上了一个使提交按钮变为可用的代码， 即可防止重复提交信息，也可以防止代码问题导致不可提交的情况 <form name=form1 action="" onSubmit=" return closebut()" > <input name="imageField" type="submit" class="inputbut" value="确定" /><br> <input type="button" name="hui" id="hui" value="让提交按钮可用" onclick="document.form1.imageField.disabled=false" /> </form> <script> function closebut(){ document.form1.imageField.disabled=true; } </script> 第三种，跟上面的类似 <script language="javascript"> function submitonce(jb51_net){ if(document.all||document.getElementById){ for(i=0;i<jb51_net.length;i++){ var tempobj=jb51_net.elements[i]; if(tempobj.type.toLowerCase()=="submit"||tempobj.type.toLowerCase()=="reset") tempobj.disabled=true; } } } </script> <form action="http://www.jb51.net" method="post" name="jb51_net" onSubmit="submitonce(this)"> <input type="text" name="name"> <input type="submit" name="submit1" value="提交"> </form> </body> </html> （编辑：葫芦岛站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
站长推荐