1.多个点击事件的研究
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>onclick.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!-- 此处演示多个点击事件 --> <script type="text/javascript"> function onlick(){ //获取dum对象的id属性 var bun=document.getElementById("inp"); //当dom对象发生点击事件时，弹出你好对话框 bun.onclick=function(){ alert('你好'); }; //当发生第二个点击事件是，会覆盖上面的一个事件 bun.onclick=function(){ alert('你也好'); }; } </script> </head> <body onload="onlick()"> <input id="inp" type="button" value="按钮"> </body> </html>
2.不同浏览器下的点击事件分析
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>onclick.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!-- 此处演示多个点击事件 --> <script type="text/javascript"> function onlick(){ //获取dum对象的id属性 var bun=document.getElementById("inp"); //attachEvent表示IE浏览器 //addEventListener 表示火狐 或者是谷歌浏览器 //此判断是否是ie览器 if(bun.attachEvent){ //如果是，则使用ie浏览器的点击事件 ，注此处的Ie使用的是栈，先进后出的形式 //IE的事件标准为Onclick bun.attachEvent("onclick",function(){ alert("IE下点击了按钮"); }); bun.attachEvent("onclick",function(){ alert("IE下再次点击了按钮"); }); }else{ //次处使用的方式是w3c的标准 //否则的话便是用CHROME谷歌 FF火狐 注：此处使用的是队列的形式，先进先出 //火狐谷歌的事件为click bun.addEventListener("click",function(){ alert("火狐下点击了按钮"); }); bun.addEventListener("click",function(){ alert("火狐下再次点击了按钮"); }); } } </script> </head> <body onload="onlick()"> <input id="inp" type="button" value="按钮"> </body> </html>