JavaScript事件绑定

一、事件绑定的方式

1.在Dom标签中通过事件属性绑定

示例

<button  οnclick="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>