### 两种绑定方式
(DOM0)1.obj.onclick = fn;

(DOM2)2.
ie:obj.attachEvent(事件名称,事件函数);
1.没有捕获(非标准的ie 标准的ie底下有 ie6到10)
2.事件名称有on
3.事件函数执行的顺序:标准ie-》正序 非标准ie-》倒序
4.this指向window
标准:obj.addEventListener(事件名称,事件函数,是否捕获);
1.有捕获
2.事件名称没有on
3.事件执行的顺序是正序
4.this触发该事件的对象


document.attachEvent('onclick', fn2);
document.attachEvent('onclick', function() {
fn1.call(document);
});

是否捕获 : 默认是false false:冒泡 true:捕获

document.addEventListener('click', fn1, false);
document.addEventListener('click', fn2, false);

注意
ie代表了:非标准ie 和 标准ie
标准代表了:标准ie 和 chrome Firefox等....

### 同步this
function bind(obj, evname, fn) {
if (obj.addEventListener) {//除ie低版本外都可以进入
obj.addEventListener(evname, fn, false);
} else {
obj.attachEvent('on' + evname, function() {
fn.call(obj);
});
}
}

bind(document, 'click', fn1);

### 两种绑定方式的区别
取消冒泡的手段:event.cancelBubble = true;(不推荐使用)
event.stopPropagation();

第一种:默认冒泡,
第一种:一个元素上只能绑定一个同类事件,如果继续绑定的话,第二个事件函数会覆盖第一个


第二种:
attachEvent
默认冒泡
addEventListener
是否捕获 : 默认是false
第三个参数: false:冒泡
true:捕获
第二种:一个元素上可以绑定多个同类事件,它们都会被执行

### 事件解绑
DOM0:想解除事件就相当简单了,只需要再注册一次事件,把值设成null
原理就是最后注册的事件要覆盖之前的,最后一次注册事件设置成null,
也就解除了事件绑定。

DOM2:removeEventListener
解除事件语法:btn.removeEventListener("事件名称", "事件回调", "捕获/冒泡");
detachEvent(ie)

### 总结
onclick形式:冒泡
attachEvent:冒泡
addEventListener:第三个参数(false:冒泡;true:捕获)

移动端和pc端事件绑定方式以及取消浏览器默认样式和取消冒泡的更多相关文章

  1. jQuery 触发事件 移动端和pc端的区别

    jQuery 触发事件 移动端和pc端的区别 <pre>mousedown event.pageXmousemove event.pageXmouseup event.pageXtouch ...

  2. iis 如何搭建url 重定向,实现无线端和pc端不同的跳转

    第一步,下载安装ARR(Application Request Routing), http://www.iis.net/downloads/microsoft/application-request ...

  3. 简述移动端与PC端的区别

    1.移动端与PC端的区别 PC考虑的是浏览器的兼容性,而移动端开发考虑的更多的是手机兼容性,因为目前不管是android手机还是ios手机,一般浏览器使用的都是webkit内核,所以说做移动端开发,更 ...

  4. 【Javascript Demo】移动端访问PC端网页时跳转到对应的移动端网页

    不想通过CSS自适应在PC端和移动端分别显示不同的样式,那么只能通过在移动端访问PC端网页时跳转到对应的移动端网页了,那么怎么跳转呢,网上也有很多文章说明,下面是本人测试有效的方式. 1.效果图 PC ...

  5. C# 移动端与PC端的数据交互

    小记:针对目前功能越来越强大的智能手机来说,在PC端支持对手机中的用户数据作同步.备份以及恢复等保护措施的应用已经急需完善.不仅要对数据作保护,而且用户更希望自己的手机跟PC能够一体化,以及和远程服务 ...

  6. 移动端和PC端弹出遮罩层后,页面禁止滚动的解决方法及探究

    PC端解决方案 pc端的解决思路就是在弹出遮罩层的时候取消已经存在的滚动条,达到无法滚动的效果. 也就是说给body添加overflow:hidden属性即可,IE6.7下不会生效,需要给html增加 ...

  7. java判断是移动端还是pc端

    // \b 是单词边界(连着的两个(字母字符 与 非字母字符) 之间的逻辑上的间隔), // 字符串在编译时会被转码一次,所以是 "\\b" // \B 是单词内部逻辑间隔(连着的 ...

  8. 前端:移动端和PC端的区别

    在阿里的几次面试中,总是被问到移动端和PC端有什么区别,当时回答的时候主要是回答了在兼容性.网速.适配.页面布局等方面的不同,但是还是很不系统,所以这里做一个总结. 第一: PC考虑的是浏览器的兼容性 ...

  9. JavaScript判断移动端及pc端访问不同的网站

    JavaScript判断移动端及pc端访问不同的网站 现在很多网站都是分为两个版本,一个pc端的一个移动端的(响应式除外),针对这两个版本,就需要对访问的设备进行判断,如果是pc,就直接访问pc网站, ...

随机推荐

  1. java基础之IO篇

    IO流 在计算机中的流是有方向的即为IO流,分为输入流和输出流,他们的方向都是以服务的方向为主,向服务器中发送指令等等就是输出流,服务器给出的反应等等,我们都说为输出流. 字节流 字符流 输入流 In ...

  2. webpack 插件拾趣 (1) —— webpack-dev-server

    结束了一季的忙碌,我这封笔已久的博客也终究该从春困的咒印中复苏,想来写些实用易读的作为开篇,自然是最好不过. 新开个 webpack 插件/工具介绍的文章系列,约莫每周更新一篇篇幅适中的文章聊以共勉, ...

  3. Ubuntu下的iptux和Windows下的飞秋互传文件

    1.问题 当Linux下的iptux是安装源里的版本时,存在下面的问题:Windows下的飞秋可以向Linux下的iptux发送文件,iptux接受正常Linux下的iputx给Windows下的飞秋 ...

  4. Solr集群搭建

    SolrCloud需要solr基于zookeeper部署,zookeeper是一个集群管理软件,由于SolrCloud需要由多台服务器组成.由zookeeper来进行协调管理.Zookeeper是一个 ...

  5. El表达式取map值

    map el表达取值 ${initMap['kehuList']}

  6. JAVAEE——spring03:spring整合JDBC和aop事务

    一.spring整合JDBC 1.spring提供了很多模板整合Dao技术 2.spring中提供了一个可以操作数据库的对象.对象封装了jdbc技术. JDBCTemplate => JDBC模 ...

  7. 0.搭建myeclipse开发环境

    1.配置jdk 2.myeclipse集成tomcat 选择默认jdk

  8. 序列、视图、索引(面试看这个就GO了)

    oracle内置对象 序列.视图.索引 序列 create sequence aaa start with 1; 使用 视图 创建好之后 然后直接用 就OK了 有了视图可以代替子查询,使得sql简洁 ...

  9. Python序列类型

    Python序列类型 序列:字符.列表.元组 所有序列都支持迭代 序列表示索引为非负整数的有序对象集合 字符和元组属于不可变序列,列表可变 1)字符 字符串字面量:把文本放入单引号.双引号或三引号中: ...

  10. Linux 可重入内核

    Linux内核是可重入的,这意味着几个进程可能同时在内核模式下执行.(当然单处理器系统,在某一时间只会有一个进程执行,但许多会阻塞在内核模式)这些进程会分时共享CPU.I/O设备等系统资源,给用户的感 ...