function initPage()
{
btn.onmouseover = buttonOver;
btn.onmouseover = buttonOut;
}
如上,浏览器只会运行指定的最后一个事件处理程序。因为事件处理程序只是属性,一个属性只能有一个值。
用addEventListener()指定多个事件处理程序。
btn.addEventListener(“mouseover”, buttonOver,false);
btn.addEventListener(“mouseover”, buttonOver1,false);
注意:事件属性名与addEventListener()的事件名不一样,如果事件属性名为onclick或onmouseover,对addEventListener()而言则是click和mouseover。
不过addEventListener()对IE浏览器不起作用,IE用了一个完全不同的事件模型,attachEvent()。
btn.addEventListener(“onmouseover”, buttonOvere);//这一次事件名前要保留on.
btn.addEventListener(“onmouseover”, buttonOver1);//只有2个参数。
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script type="text/javascript"> window.onload = initPage; function initPage() { var inputs = document.getElementsByTagName("input"); for (var i = 0; i < inputs.length; i++) { var tt = inputs[i]; // tt.addEventListener("blur", showValue, false); // tt.addEventListener("change", change, false); addEventHandler(tt, "blur", showValue); addEventHandler(tt, "change", change); } } function change() { alert("changed!"); } function showValue() { switch (this.title)//this指的是调用当前函数的对象,本处即失去焦点的文本框。 { case "name": alert(this.value); break; default: alert("pwd"); } } // 增加一个工具函数,用于IE或其他浏览器时,多事件程序判断。 //对象,事件名,处理函数 function addEventHandler(obj, eventName, handler) { if (document.attachEvent) { obj.attachEvent("on" + eventName, handler); } else if (document.addEventListener) { obj.addEventHandler(eventName, handler, false); } } </script> </head> <body> <form id="form1" runat="server"> <div id="txt"> <input type="text" id="username" title="name" /> <input type="text" id="password" title="pwd" /> </div> </form> </body> </html>