码迷,mamicode.com
首页 > Web开发 > 详细

js各类浏览器兼容问题

时间:2017-03-25 23:45:32      阅读:332      评论:0      收藏:0      [点我收藏+]

标签:兼容   包含   取消   als   div   click   其他   opp   rem   

IE低版本浏览器和其他浏览器一般都不一样,为了实现兼容,可以采用以下的方法:
 
/*为元素添加事件监听   兼容各种浏览器*/
if(div.attachEvent){  //ie浏览器
    div.attachEvent("onclick",show);
}else{
    div.addEventListener("click",show,false);
}

/*同样的道理   为元素移除事件监听   兼容各种浏览器*/
if(div.detachEvent){
    div.detachEvent("onclick",show);
}else{
    div.removeEventListener("click",show,false);
}
 
当一个父级容器(如div)中包含有几个子集容器(div)时,任意点击一个容器(div),都会触发其他容器的事件。为了解决这类问题,示例如下:
//false  事件冒泡(从子元素到父元素)  true:事件捕获(从父元素到子元素)
div1.addEventListener("click",showConsole1,false);
 function showConsole1(e){
        e = e || window.event;
//        事件冒泡的处理  阻止事件冒泡
        if(e.stopPropagation){
            e.stopPropagation();  //非ie
        }else{
            e.cancelBubble = true;
        }

        console.log("div1");
    }
 
<a href="https://www.baidu.com/" onclick="showBaiDu(event)">众里寻他千百度</a>
/*三:取消默认事件*/
function showBaiDu(e){
    if(e.preventDefault){   /*非IE浏览器*/
        e.preventDefault();
    }else{                   /*IE浏览器*/
        e.returnValue = false;
    }
    console.log("不跳转!");
}

js各类浏览器兼容问题

标签:兼容   包含   取消   als   div   click   其他   opp   rem   

原文地址:http://www.cnblogs.com/sunshine-my/p/6618883.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!