知识点总结

  • 事件捕获
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的更多相关文章

  1. [妙味DOM]第五课:事件深入应用

    知识点总结 鼠标拖拽原理: 1.鼠标按下后开始移动,鼠标抬起停止移动,即onmousedown中要包括onmousemove和onmouseup 2.获取位置的计算:获取鼠标的当前位置-鼠标在物体中的 ...

  2. Event事件详解

    首先提到event,先要明白event的产生,也要先明白焦点,什么是焦点.焦点 : 使浏览器能够区分用户输入的对象,当一个元素有焦点的时候,那么他就可以接收用户的输入. 我们可以通过一些方式给元素设置 ...

  3. [妙味DOM]第六课:鼠标滚轮和COOKIE

    知识点总结: 鼠标滚轮事件 存在兼容性问题: IE/chorme : onmousewheel FF : DOMMouseScroll,必需用在addEventListener下,例如: if (ob ...

  4. [妙味DOM]第三课:Event-事件详解1

    知识点总结 焦点事件 onfocus 获取焦点 onblur 失点焦点 obj.focus() 给指定元素设置焦点 obj.blur() 取消指定元素的焦点 obj.select() 选择指定元素里的 ...

  5. JavaScript——event事件详解

    1.事件对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 什么时候会产生Event 对象呢? 例如: 当用户单击某个元素的时候,我们给这个元 ...

  6. DOM——事件详解

    事件 事件:触发-响应机制 事件三要素 事件源:触发(被)事件的元素 事件名称: click 点击事件 事件处理程序:事件触发后要执行的代码(函数形式) 事件的基本使用  var box = docu ...

  7. JavaScript事件详解-jQuery的事件实现(三)

    正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...

  8. JavaScript事件详解-Zepto的事件实现(二)【新增fastclick阅读笔记】

    正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...

  9. JavaScript事件详解-zepto的事件实现

    zepto的event 可以结合上一篇JavaScript事件详解-原生事件基础(一)综合考虑源码暂且不表,github里还有中文网站都能下到最新版的zepto.整个event模块不长,274行,我们 ...

随机推荐

  1. TestNG中的DataProvider返回Iterator<Object[]>的妙用

    TestNG中使用DataProvider有个好处,就是: 1. 在执行用例的时候dataProvider迭代中的每组数据都是作为一个用例执行 2. 在测试数据有规律的情况下,免去了添加testXML ...

  2. Oracle怎么更改用户名和密码

    通过修改ORACLE基表的方式来修改用户名直接修改底层表USER$更改用户名(该方法在Oracle9i,Oracle10g中测试通过)SQL> UPDATE USER$ SET NAME='TT ...

  3. 干货云集 WOT 2017全球架构与运维技术峰会揭密技术难点

    WOT,World Of Tech专注互联网IT技术领域,是一场不容错过的技术盛会!WOT 2017全球架构与运维技术峰会三大章节,15大技术专场,60+国内外一线互联网精英大咖站台,打造兼顾技术视野 ...

  4. 校门外的树 OpenJudge 1.6.06

    06:校门外的树 总时间限制:  1000ms 内存限制:  65536kB 描述 某校大门外长度为L的马路上有一排树,每两棵相邻的树之间的间隔都是1米.我们可以把马路看成一个数轴,马路的一端在数轴0 ...

  5. 解码红外遥控信号——使用遥控器的按键来调节LED的亮度

    程序开始时,提示遥控键0~4的代码,然后程序通过设置LED的亮度来对被按下的按钮作出响应,以0关闭LED,1~4提供增加的亮度. 代码如下:(需要使用IRremote库,可在库管理中搜索该库进行下载后 ...

  6. angular-ui-bootstrap插件API - Tabs

    Tabs 案例 <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> ...

  7. Web Scraper使用

    { "selectors": [{ "parentSelectors": ["_root"], "type": &quo ...

  8. 【2】JavaScript编程全解笔记(二)

    你过去的种种经历,就像人生的一颗颗珍珠,在未来的某一天,你找到了那根线,你就会把她们串联起来,变成美丽的项链. 第八章 客户端 JavaScript 与 HTML 1. 浏览器渲染页面的步骤 2.   ...

  9. 如何使用Git上传代码到GitHub

    1.在Github上面创建Github仓库: 2.下载Github Shell到本地:https://desktop.github.com/ 3.打开Github Shell,输入以下命令生成秘钥来验 ...

  10. SpringMVC一路总结(一)(转)

    itRed You are never too old to set another goal or to dream a new dream. SpringMVC一路总结(一) SpringMVC听 ...