JavaScript事件綁定

一、事件綁定的方式

1.在Dom標籤中通過事件屬性綁定

示例

<button  onclick="clickMe()">點我呀</button>

注意：

onclick中若爲函數名，即使沒有參數，也要帶上函數後的括號（）。

2.在JavaScript中通過on+eventType進行綁定

示例

	<button id="btnOne">點我呀</button>
	<script>
		function clickMe() {
			alert("你點我了");
		}
		var btn = document.getElementById("btnOne");
		btn.onclick = clickMe;
	</script>

注意：onclick事件後註冊的爲匿名函數或者函數名，爲函數名時，不能帶參數，及括號（）;否則只相當於立即調用了一次函數，事件並不能成功註冊。與onclick屬性標籤綁定效果相同，重複綁定，最後一個生效！

3.在JavaScript中註冊事件監聽

示例

	<button id="btnOne">點我呀2</button>
	<script>
		function clickMe() {
			alert("你點我了");
		}
		var btn = document.getElementById("btnOne");
		btn.addEventListener("click",clickMe,false);
	</script>

注意：addEventListener第一個參數爲eventType不帶on，第二個參數爲匿名函數或者函數名，爲函數名時，不能帶參數，及括號（）;否則只相當於立即調用了一次函數，事件並不能成功註冊，第三個參數一般爲false。重複註冊，均能生效，調用順序與註冊順序一致！IE8及以前IE不支持這種方式，使用的是

element.attachEvent(event, function)

event：（必需）事件類型。需加“on“，例如：onclick。

function：（必需）指定要事件觸發時執行的函數。

示例

	<button id="btnOne">點我呀2</button>
	<script>
		function clickMe() {
			alert("你點我了");
		}
		var btn = document.getElementById("btnOne");
		btn.attachEvent("onclick",clickMe);
	</script>

兼容不同瀏覽器的版本示例如下

	<button id="btnOne">點我呀2</button>
	<script>
		function clickMe() {
		var btn = document.getElementById("btnOne");
			alert("你點我了");
		}
		if(btn.addEventListener) {
		} else {
			btn.addEventListener("click", clickMe, false);
			btn.attachEvent("onclick", clickMe);
		}
	</script>