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

最新推荐文章于 2023-02-06 00:11:06 发布

颜洁

最新推荐文章于 2023-02-06 00:11:06 发布

阅读量212

点赞数

本文链接：https://blog.csdn.net/amytun_yu/article/details/52809872

版权

                        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

收藏

觉得还不错? 一键收藏
0
评论
Acticle 6:javascript事件：事件的绑定

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

扫一扫