当前位置: 代码迷 >> JavaScript >> JS统制按钮不能连续被点击
  详细解决方案

JS统制按钮不能连续被点击

热度:109   发布时间:2012-06-27 14:20:09.0
JS控制按钮不能连续被点击
将下面代码拷贝进一个html文件中就可以运行查看效果。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <script type="text/javascript">
	function downLoad(evt) {
		disabledButton();
		MyPeriodicalExecuter(evt);
	}
	function disabledButton(){
		var inputs = document.getElementsByTagName("input");
		for(var i = 0;i<inputs.length;i++){
			if(inputs[i].type.toLowerCase()=="button")
				inputs[i].disabled=true;
		}
	}
	
	function MyPeriodicalExecuter(evt){
		succ.obj=evt;
		succ.loop=0;
		sh=setInterval(succ,1000);
	}
	
	function succ(){
		var str="禁止连续点击,"
		with(arguments.callee){
			obj.value=str+"("+(loop++)+"/15)秒后再试";
			if (loop > 15){
				enabledButton();
				obj.value=" 下载 ";
				clearInterval(sh);
				return;
			}	
		}
	}

	function enabledButton(){
		var inputs = document.getElementsByTagName("input");
		for(var i = 0;i<inputs.length;i++){
			if(inputs[i].type.toLowerCase()=="button")
				inputs[i].disabled=false;
		}
	}
  </script>
 </HEAD>

 <BODY>
	<!--如果有样式,可以设置type="botton",class="style"-->
  <input type="button" value="下载" onClick="downLoad(this)"/>
 </BODY>

</HTML>

  相关解决方案