[妙味DOM]第四课:Event-事件详解2
知识点总结
- 事件捕获
obj.addEventListener('click',fn,true)
从外往里
obj.addEventListener('click',fn,false)
从里往外(冒泡)
- 事件取消
1、
obj.onclick = fn;
obj.onclick = null;
赋'null'值即可 2、
IE:
obj.attachEvent('onclick',fn);
obj.detachEvent('onclick',fn); //取消 标准:
obj.addEventListener('click',fn,false)
obj.removeEventListener('click',fn,false) //取消,注意:事件捕捉true或false
- 键盘事件
onkeydown 键盘按下
onkeyup 键盘抬起 ev.keycode 键值(数字类型) ev.ctrlKey
ev.altKey
ev.shiftKey 为布尔值,按下是为true 例子:留言本
使用onkeyup
如果使用onkeydown,总是会返回上一次的数据
- 阻止默认事件
return false 阻止默认事件
oncontextmenu 屏蔽右键菜单
document.oncontextmenu = function(){
return false;
}
例子:弹出自定义右键菜单(需要鼠标事件clientX和clientY)
[妙味DOM]第四课:Event-事件详解2的更多相关文章
- [妙味DOM]第五课:事件深入应用
知识点总结 鼠标拖拽原理: 1.鼠标按下后开始移动,鼠标抬起停止移动,即onmousedown中要包括onmousemove和onmouseup 2.获取位置的计算:获取鼠标的当前位置-鼠标在物体中的 ...
- Event事件详解
首先提到event,先要明白event的产生,也要先明白焦点,什么是焦点.焦点 : 使浏览器能够区分用户输入的对象,当一个元素有焦点的时候,那么他就可以接收用户的输入. 我们可以通过一些方式给元素设置 ...
- [妙味DOM]第六课:鼠标滚轮和COOKIE
知识点总结: 鼠标滚轮事件 存在兼容性问题: IE/chorme : onmousewheel FF : DOMMouseScroll,必需用在addEventListener下,例如: if (ob ...
- [妙味DOM]第三课:Event-事件详解1
知识点总结 焦点事件 onfocus 获取焦点 onblur 失点焦点 obj.focus() 给指定元素设置焦点 obj.blur() 取消指定元素的焦点 obj.select() 选择指定元素里的 ...
- JavaScript——event事件详解
1.事件对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 什么时候会产生Event 对象呢? 例如: 当用户单击某个元素的时候,我们给这个元 ...
- DOM——事件详解
事件 事件:触发-响应机制 事件三要素 事件源:触发(被)事件的元素 事件名称: click 点击事件 事件处理程序:事件触发后要执行的代码(函数形式) 事件的基本使用 var box = docu ...
- JavaScript事件详解-jQuery的事件实现(三)
正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...
- JavaScript事件详解-Zepto的事件实现(二)【新增fastclick阅读笔记】
正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...
- JavaScript事件详解-zepto的事件实现
zepto的event 可以结合上一篇JavaScript事件详解-原生事件基础(一)综合考虑源码暂且不表,github里还有中文网站都能下到最新版的zepto.整个event模块不长,274行,我们 ...
随机推荐
- USACO 4.2 The Perfect Stall(二分图匹配匈牙利算法)
The Perfect StallHal Burch Farmer John completed his new barn just last week, complete with all the ...
- eclipse安装
1.下载破解版本 地址:http://www.oyksoft.com/soft/1250.html 2.解压下载包,直接运行eclipse.exe 3.安装过程中如果遇到问题 1).如果遇到erro ...
- 教你成为全栈工程师(Full Stack Developer) 一-各显神通总结八大类编程语言的区别
为了能在最快的时间里理解更多语言的相同点和不同点,我用大家最熟悉的Hello World来展示一下各个语言的奥妙 请尊重原创,转载请注明来源网站www.shareditor.com以及原始链接地址 ...
- sequekize
关于sequelize的准备工作这里不再赘述. 一.引入sequelize模块 var Sequelize = require('sequelize'); 二.连接数据库 var sequelize ...
- jquery ColorPicker 颜色选择器
$(function() { $('#colorpickerField').ColorPicker({ onSubmit: function(hsb, hex, rgb, el) { $(el).va ...
- C# CookieHelper
using System; using System.Web; using System.Collections.Specialized; namespace Utils { /// <summ ...
- Zookeeper,Kafka,Spark关系
Kafka中ZooKeeper的用途 正如ZooKeeper用于分布式系统的协调和促进,Kafka使用ZooKeeper也是基于相同的原因.ZooKeeper用于管理.协调Kafka代理.每个Kafk ...
- size_t
size_t在C语言中就有了.它是一种"整型"类型,里面保存的是一个整数,就像int, long那样.这种整数用来记录一个大小(size).size_t的全称应该是size typ ...
- macos上安装wget命令
首先从Apple Store下载Xcode,然后安装Xcode,接着安装Homebrew包管理,类似于Ubuntu下的apt-get: 终端下输入ruby -e "$(curl -fsSL ...
- C++ 中的计时器
在Java中,有时候会要测试程序的性能,所以会采用System.currentTimeMillis()等类库函数去测试时间开销. 在C++中同样可以完成此功能. 头文件: #include<ct ...