移动端和pc端事件绑定方式以及取消浏览器默认样式和取消冒泡
### 两种绑定方式
(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端事件绑定方式以及取消浏览器默认样式和取消冒泡的更多相关文章
- jQuery 触发事件 移动端和pc端的区别
jQuery 触发事件 移动端和pc端的区别 <pre>mousedown event.pageXmousemove event.pageXmouseup event.pageXtouch ...
- iis 如何搭建url 重定向,实现无线端和pc端不同的跳转
第一步,下载安装ARR(Application Request Routing), http://www.iis.net/downloads/microsoft/application-request ...
- 简述移动端与PC端的区别
1.移动端与PC端的区别 PC考虑的是浏览器的兼容性,而移动端开发考虑的更多的是手机兼容性,因为目前不管是android手机还是ios手机,一般浏览器使用的都是webkit内核,所以说做移动端开发,更 ...
- 【Javascript Demo】移动端访问PC端网页时跳转到对应的移动端网页
不想通过CSS自适应在PC端和移动端分别显示不同的样式,那么只能通过在移动端访问PC端网页时跳转到对应的移动端网页了,那么怎么跳转呢,网上也有很多文章说明,下面是本人测试有效的方式. 1.效果图 PC ...
- C# 移动端与PC端的数据交互
小记:针对目前功能越来越强大的智能手机来说,在PC端支持对手机中的用户数据作同步.备份以及恢复等保护措施的应用已经急需完善.不仅要对数据作保护,而且用户更希望自己的手机跟PC能够一体化,以及和远程服务 ...
- 移动端和PC端弹出遮罩层后,页面禁止滚动的解决方法及探究
PC端解决方案 pc端的解决思路就是在弹出遮罩层的时候取消已经存在的滚动条,达到无法滚动的效果. 也就是说给body添加overflow:hidden属性即可,IE6.7下不会生效,需要给html增加 ...
- java判断是移动端还是pc端
// \b 是单词边界(连着的两个(字母字符 与 非字母字符) 之间的逻辑上的间隔), // 字符串在编译时会被转码一次,所以是 "\\b" // \B 是单词内部逻辑间隔(连着的 ...
- 前端:移动端和PC端的区别
在阿里的几次面试中,总是被问到移动端和PC端有什么区别,当时回答的时候主要是回答了在兼容性.网速.适配.页面布局等方面的不同,但是还是很不系统,所以这里做一个总结. 第一: PC考虑的是浏览器的兼容性 ...
- JavaScript判断移动端及pc端访问不同的网站
JavaScript判断移动端及pc端访问不同的网站 现在很多网站都是分为两个版本,一个pc端的一个移动端的(响应式除外),针对这两个版本,就需要对访问的设备进行判断,如果是pc,就直接访问pc网站, ...
随机推荐
- angular多页面切换传递参数
<!DOCTYPE html> <html lang="en" ng-app="myapp"> <head> <met ...
- Netty方法误解ChannelHandlerContext.writeAndFlush(Object msg)
乍一看这个方法,以为什么消息都能输出,因为参数是Object类型的,但实际上,netty内部只支持两种类型,如图
- tomcat之 JDK8.0安装、tomcat-8.5.15安装
前言:JDK(Java Development Kit)是Sun Microsystems针对Java开发员的产品.自从Java推出以来,JDK已经成为使用最广泛的Java SDK. JDK是整个Ja ...
- 关于MATLAB收集人工鼠标移动轨迹的坐标
首先需要设计一个用户图形界面的函数,这个图形界面被用于在其上面绘制轨迹并记录当时的坐标. 该回响函数应包含:鼠标按下时,鼠标移动时,和鼠标释放时的反应命令.当然网上有有相关的开源 程序,但是有缺陷(该 ...
- Yii 中出现“<?= ... ?>”是什么意思?
这是php的标签,和<?php ?>一样的.用<?= ?> 就不用echo,否则你要输出的话,需要加上echo词汇输出.这个就是用在模板里面方便点.
- 1.如何安装matlab2016a
下载:见网盘 安装教程: 解压安装文件,安装文件为 iso 格式,但是不能通过虚拟光驱安装,需要将 iso 文件用解压软件解压.注意,R2016b_win64_dvd1.iso 和 R2016b_wi ...
- 从Android源码的角度分析Binder机制
欢迎访问我的个人博客,原文链接:http://wensibo.top/2017/07/03/Binder/ ,未经允许不得转载! 前言 大家好,好久不见,距离上篇文章已经有35天之久了,因为身体不舒服 ...
- SharePoint 2013 安装
步骤 1:打开提升的 SharePoint 2013 命令行管理程序 选择与您的服务器操作系统对应的过程. 在 Windows Server 2008 R2 中 单击“开始”>“所有程序”> ...
- (转载)oracle 在一个存储过程中调用另一个返回游标的存储过程
原文链接:http://www.jb51.net/article/20160.htm 实际项目当中经常需要在一个存储过程中调用另一个存储过程返回的游标,本文列举了两种情况讲述具体的操作方法. 第一种情 ...
- win32SDK的hello,world程序(二)
接上篇,原生的控件都不太好看,所以决定自己画一个,稍微处理下消息就能用了.不过,美化这东西是需要天赋的.即使技术再好,没有对UI布局调整和良好的审美能力,做出来的东西还是很挫. 主要把消息逻辑和画的过 ...