Javascript中点击(click)事件的三种写法举例

来自:网络
时间:2024-06-10
阅读:

方法一:

<!DOCTYPE html>
<html>
<head>
	<title>Javascript中点击事件方法一</title>
</head>
<body>
	<button id="btn">click</button>
	<script type="text/javascript">
		var btn = document.getElementById("btn");
		btn.οnclick=function(){
			alert("hello world");
		}
	</script>
</body>
</html>

消除事件:btn.οnclick=null;

方法二:

<!DOCTYPE html>
<html>
<head>
	<title>Javascript中点击事件方法二</title>
</head>
<body>
	<button id="btn">click</button>
	<script type="text/javascript">
		var btn = document.getElementById("btn");
		btn.addEventListener('click',function(){
			alert("hello wrold");
		},false)
	</script>
</body>
</html>

方法三:

<!DOCTYPE html>
<html>
<head>
	<title>Javascript中点击事件方法三</title>
	<script type="text/javascript">
		function test(){
			alert("hello world");
		}
	</script>
</head>
<body>
	<button id="btn" οnclick="test()">click</button>
</body>
</html>

附:js连续指定两次或者多次的click事件(解决办法)

setTimeout (表达式,延时时间)

setTimeout(表达式,交互时间)

延时时间/交互时间是以豪秒为单位的(1000ms=1s)

setTimeout  在执行时,是在载入后延迟指定时间后,去执行一次表达式,仅执行一次

setTimeout 在执行时,它从载入后,每隔指定的时间就执行一次表达式

if(ischoose == false){
                ischoose = true;
                document.getElementById("myBaby").click();
       } else {
                document.getElementById("myBaby").click();//奇数次单击和偶数次单击不同的效果!
                setTimeout(function(){document.getElementById("myBaby").click();},50);
       }

总结 

返回顶部
顶部