Acticle 6:javascript事件：事件的绑定

来源：互联网发布：手机变脸软件编辑：程序博客网时间：2024/05/29 16:23

                        JS事件绑定

什么是事件
JavaScript 使我们有能力创建动态页面。事件是可以被 JavaScript 侦测到的行为。网页中的每个元素都可以产生某些可以触发JavaScript函数的事件。
2.事件绑定
事件绑定呢，有两种方式：一是在ie浏览器下的事件绑定，二是火狐浏览器下的事件绑定。下面是关于在两种浏览器下事件绑定兼容性的代码：

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>        <script type="text/javascript">            window.onload=function(){                var oBtn=document.getElementById('btn');//              oBtn.onclick=function(){//                  alert('a');//              }//              oBtn.onclick=function(){//                  alert('b');//              }                //attachEvent ie起作用//              oBtn.attachEvent('onclick',function(){//                  alert('a');//              });//              oBtn.attachEvent('onclick',function(){//                  alert('b');//              });//              addEventListener FF火狐起作用                if(oBtn.attachEvent)                {                    oBtn.attachEvent('onclick',function()                    {                        alert('a');                    });                    oBtn.attachEvent('onclick',function()                    {                        alert('b');                    });                }                else                {                    oBtn.addEventListener('click',function()                    {                        alert('a');                    },false);                    oBtn.addEventListener('click',function()                    {                        alert('b');                    },false);                }            }        </script>    </head>    <body>        <input type="button" id="btn" value="点击" />    </body></html>

事件绑定兼容性封装函数：

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>        <script type="text/javascript">            function addEvent(obj,ev,fn){                if(obj.attachEvent){                    obj.attachEvent('on'+ev,fn);                }                else{                    obj.addEventListener(ev,fn,false);                }            }            window.onload=function(){                var oBtn=document.getElementById('btn');                addEvent(oBtn,'click',function(){                    alert('a');                });                addEvent(oBtn,'click',function(){                    alert('b');                });            }        </script>    </head>    <body>        <input type="button" id="btn" value="点击" />    </body></html>

0 0