我们在使用js操作页面的时候兼容问题是很常见的,下面将常见的兼容问题及其对应的解决方法分享给大家:

1、获取事件对象的兼容写法:

   IE中:window.event

      正常浏览器中:对象.on事件 = function(event){}      
//包装函数兼容写法:
function fn(eve){
      var e = eve || window.event;
       }
2、键盘按键获取的兼容写法:
//先获取键盘事件对象  
var eve = eve || window.event
//在通过键盘事件对像获取键盘的 按键信息
//在非IE和IE中的兼容写法
var keyC = eve.keyCode || eve.which

3、阻止事件冒泡

  eve.cancelBubble = true;        //兼容IE

  eve.stopPropagation();           //其他浏览器  

 //封装函数:
  function stopBubble(e){
if(e.stopPropagation){
e.stopPropagation();
}else{
eve.cancelBubble = true;
}
}

4、阻止浏览器默认事件兼容写法:

 e.preventDefault();         //兼容IE

    window.event.returnValue = false;   //常规版
 
 还有一种无兼容问题方法:return  false;
 加在需要阻止默认事件的程序末尾;
//封装函数
function stopDefault(e){
  if( e.preventDefault ){
e.preventDefault();
}else{
window.event.returnValue = false;
}
}

5、事件的监听式绑定(DOM2级事件绑定)中绑定事件及去除事件的兼容写法:

  非IE:     oDiv.addEventListener('click',fn,false);   //添加事件

       oDiv.removeEventListener('click',fn ,false);   //删除事件

  IE :     oDiv.attachEvent();  //添加事件

         oDiv.detachEvent() ;   //删除事件

 //封装成两个函数的方式
//添加事件
function addEvent(obj,inci,back){
if(obj.addEventListener){
obj.addEventListener(inci,back);
}else if(obj.attachEvent){
obj.attachEvent("on" + inci,back);
}else{
obj["on"+inci] = back;
}
}
//去除事件
function removeEvent(obj,inci,back){
if(obj.removeEventListener){
obj.removeEventListener(inci,back,false);
}else if(obj.detachEvent){
obj.detachEvent("on" + inci,back);
}else{
obj["on"+inci] = null;
}
}

js的兼容问题以及解决方式(持续更新)的更多相关文章

  1. 那些不兼容 IE11的网站(持续更新)

    此博文用于收集不兼容 IE11 的网站,持续更新,请网站开发者自己认领: 兼容性引起的功能缺陷: v.qq.com (提示未安装 Flash 播放器,这问题我反馈几百年了,还没修复) tv.sohu. ...

  2. Django和Angular.js模板标签冲突的解决方式

    参考文章:http://yanhua365.lofter.com/post/b417f_1f0361 http://stackoverflow.com/questions/8302928/angula ...

  3. 总结js常用函数和常用技巧(持续更新)

    学习和工作的过程中总结的干货,包括常用函数.常用js技巧.常用正则表达式.git笔记等.为刚接触前端的童鞋们提供一个简单的查询的途径,也以此来缅怀我的前端学习之路. PS:此文档,我会持续更新. Aj ...

  4. js 浏览器兼容问题及解决办法

    JS中出现的兼容性问题的总结 1.关于获取行外样式 currentStyle 和 getComputedStyle 出现的兼容性问题  我们都知道js通过style不可以获取行外样式,当我们需要获取行 ...

  5. js失效的原因及解决方式

    1.在head中先引用了js文件再引用jquery,应先引用jquery 2.js文件中所有代码应包含在$(function(){ });中

  6. 微信图片反防盗链 用js不太成熟的解决方式 仅供参考

    $("#imgDiv img").each(function () { var img = $(this); var img_src = img.attr("src&qu ...

  7. js中 if不判断解决方式

    $(function() { $("#number").blur(function() { var number = $('#number').val(); var num = $ ...

  8. Android开发中Eclispe相关问题及相应解决(持续更新)

    1.Eclipse项目中的Android Private Libraries没有自动生成. 一般而言,在Android开发中,项目中引用到的jar包会放到项目目录中的libs中,引入库会放到Andro ...

  9. Android开发中的问题及相应解决(持续更新)

    最近博客写的少了,以后还得经常更新才行. ------------------------------------------------------------ 1.特定业务需求下try cath ...

随机推荐

  1. 前端基于vue,后台采用springboot+shiro的方式搭建的一个移动端商品展示平台

    基于vue实现的移动端商品展示页,可以web-view的方式嵌入到小程序中,布局简约.大气,减少初学者或开发者不必要的工作量.后台维护采用的springboot+shiro的方式,为广大爱好者提供展示 ...

  2. IIS身份验证和文件操作权限(一、身份验证配置)

    最近有一个项目服务器需要升级,主要是Web项目.因为以前是只写代码,不管发布.所以在环境构筑方面就出现自己的知识盲点.盲点一:IIS的身份验证的作用盲点二:IIS的身份验证和文件操作权限的关系(重点) ...

  3. 【Android Studio】Frameworks detected: Android framework is detected in the project Configure

    刚开始在 Mac 上用 Android Studio, 打开第一个项目就遇到了问题,描述如下: 上午9:: Frameworks detected: Android framework is dete ...

  4. Android平台使用Ceres Solver

    在Android平台上使用Ceres求解器,官方教程不明确,且编译过程遇到了很多问题. 环境 Ubuntu 18.04 源代码 https://github.com/Great-Keith/ceres ...

  5. 【Java例题】5.5 两个字符串中最长公共子串

    5. 查找两个字符串中含有的最长字符数的公共子串. package chapter5; import java.util.Scanner; public class demo5 { public st ...

  6. [Spring cloud 一步步实现广告系统] 14. 全量索引代码实现

    上一节我们实现了索引基本操作的类以及索引缓存工具类,本小节我们开始实现加载全量索引数据,在加载全量索引数据之前,我们需要先将数据库中的表数据导出到一份文件中.Let's code. 1.首先定义一个常 ...

  7. Scala基础语法学习(一)

    1. val和var的区别 val定义的是一个常量,无法改变其内容 scala> val s = 0 s: Int = 0 scala> s = 2 <console>:12: ...

  8. 【POJ - 3280】Cheapest Palindrome(区间dp)

    Cheapest Palindrome 直接翻译了 Descriptions 给定一个字符串S,字符串S的长度为M(M≤2000),字符串S所含有的字符的种类的数量为N(N≤26),然后给定这N种字符 ...

  9. SAP无法激活表问题

    因为修改了表结构导致无法激活,刚开始以为是数据库没有调整,然后试着运行SE14,发现还是报错 这个时候就要看看数据库服务器时候正常,输入事务码ST04,查看概览,发现磁盘已满 登录HANA Studi ...

  10. ES6中比较实用的几个特性

    1.Default Parameters(默认参数) in ES6 es6之前,定义默认参数的方法是在一个方法内部定义 var link = function (height, color, url) ...