zoukankan      html  css  js  c++  java
  • 兼容动态绑定事件

     

    此文章是帮助班上的一个同学学习,本人菜鸟,请各路大神指点或者绕道

    动态绑定事件在IE内核 和 火狐等相同的内核下分为两种情况  ,
    1. attachEvent,
    2.addEventListener
    下面我们用代码的形式来演示

    在火狐下运行:  

    <!DOCTYPE html>
    <meta charset="utf-8">
    <html>
    <head>
        <title></title>
        <script type="text/javascript" src="NANF.js"></script>
        <script type="text/javascript">
            function init(){                   //初始函数
                var testObj=document.getElementById("test");     //得到Id为test 的元素
                testObj.addEventListener("click",function(){
                    alert("我在火狐下运行");
                });
    
            }
        </script>
    
    </head>
    <body onload="init()">
        <input id="test" type="button" value="测试">
    
    </body>
    </html>
    

     注: addEventListener("click",function(){})    click 前面不用加 “on”  

    在IE下运行:

    <!DOCTYPE html>
    <meta charset="utf-8">
    <html>
    <head>
        <title></title>
        <script type="text/javascript" src="NANF.js"></script>
        <script type="text/javascript">
            function init(){                   //初始函数
                var testObj=document.getElementById("test");     //得到Id为test 的元素
                testObj.attachEvent("onclick",function(){
                    alert("我在IE下运行");
                });
    
            }
        </script>
    
    </head>
    <body onload="init()">
        <input id="test" type="button" value="测试">
    
    </body>
    </html>
    

     为了兼容火狐和IE :

    <!DOCTYPE html>
    <meta charset="utf-8">
    <html>
    <head>
        <title></title>
        <script type="text/javascript" src="NANF.js"></script>
        <script type="text/javascript">
            function init(){                   //初始函数
                var testObj=document.getElementById("test");     //得到Id为test 的元素
                if(navigator.appName == "Netscape")  {          //判断是否为火狐
                    testObj.addEventListener("click",function(){
                          alert("都能运行");
                    });
                }
                else {
                    testObj.attachEvent("onclick",function(){
                        alert("都能运行");
                    });
                }
    
            }
        </script>
    
    </head>
    <body onload="init()">
        <input id="test" type="button" value="测试">
    
    </body>
    </html>
  • 相关阅读:
    matlab 修改窗口logo 使用Javaframe
    matlab guide 开发心得
    判断两个集合的包含关系
    xaml 中 引用嵌套类的对象
    xaml中显示 “大括号左边” 文本
    步进电机脉冲与毫米
    最短路径:Dijkstra算法 C#
    JPA自定义sql的三种方式
    double相乘少一分的问题,BigDecimal参数传小数也会出问题
    String类小知识
  • 原文地址:https://www.cnblogs.com/xuehaiyiye/p/3475879.html
Copyright © 2011-2022 走看看