当点击按钮后,按钮即变为灰色,不可再次点击!
防止用户重复提交数据。
XML/HTML代码
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
- <title>表单点击提交按钮后变成灰色不可再次点击</title>
- </head>
- <body>
- <form name=form1 method="POST" action="http://www.baidu.com" 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>
- </body>
- </html>
附一个在蓝色理想看到的例子:
XML/HTML代码
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
- <html>
- <head>
- <title> New Document </title>
- </head>
- <body>
- <form action="somepage.asp">
- <input type="text" value="0" name="txt1"/>
- <input type="button" value="开始" name="btnStart"/>
- <input type="button" value="重置" name="btnReset"/>
- </form>
- </body>
- </html>
- <script language="JavaScript" type="text/javascript">
- <!--
- //获取表单中的表单域
- var txt=document.forms[0].elements["txt1"];
- var btnStart=document.forms[0].elements["btnStart"];
- var btnReset=document.forms[0].elements["btnReset"]
- //定义定时器的id
- var id;
- //每10毫秒该值增加1
- var seed=0;
- btnStart.onclick=function(){
- //根据按钮文本来判断当前操作
- if(this.value=="开始"){
- //使按钮文本变为停止
- this.value="停止";
- //使重置按钮不可用
- btnReset.disabled=true;
- //设置定时器,每0.01s跳一次
- id=window.setInterval(tip,10);
- }else{
- //使按钮文本变为开始
- this.value="开始";
- //使重置按钮可用
- btnReset.disabled=false;
- //取消定时
- window.clearInterval(id);
- }
- }
- //重置按钮
- btnReset.onclick=function(){
- seed=0;
- }
- //让秒表跳一格
- function tip(){
- seed++;
- txt.value=seed/100;
- }
- //-->
- </script>