js中表单提交后按钮变灰色的功能
来源：自学PHP网
时间：2014-09-19 14:47 作者：
阅读:次
[导读] 表单提交后按钮变灰色的功能实现方法，可有效防止重复提交表单，如果提交动作没有完成，则一直呈灰色状态等待确认。代码的实现也是超简单的，此方法也是实用...
|
在点击“Submit按钮”之后，将Submit设置为Disable，使按钮变灰不可用，具体的做法如下：
1、先在Form里加入：
| 代码如下 |
复制代码 |
|
onSubmit="submitonce(this)"
|
2、再在“Submit按钮”之前加入下面的代码：
| 代码如下 |
复制代码 |
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>表单提交后按钮变成灰色</title>
</head>
<body>
<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>
</body>
</html>
|
我们写在input中不好，我们可以写成函数，例
| 代码如下 |
复制代码 |
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1
-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>表单提交后按钮变灰代码</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
</head>
<body>
<script language="javascript">
function my_submit(){
document.form1.submit();
document.form1.submit1.disabled=true;
}
</script>
<form action="/" method="post" name="form1">
<input type="text" name="name">
<input type="button" name="submit1" value="提交" onClick="javascript:my_submit();">
</form>
</body>
</html>
|
3、如果Form中原本就存在onSubmit动作，或者按钮类型不是Submit，而是button，则在onSubmit作用的函数中加入下
面的代码：
document.fHtmlEditor.Submit.disabled=true;
如果你想禁止当前页面所有按钮可使用下面代码
| 代码如下 |
复制代码 |
|
<script language="javascript">
function submitonce(theform){
if (document.all||document.getElementById){
for (i=0;i<theform.length;i++){
var tempobj=theform.elements
if(tempobj.type.toLowerCase()=="submit")
tempobj.disabled=true
}
}
}
</script>
|
|
