js 事件监听

王朝学院·作者佚名  2016-05-22
窄屏简体版  字體: 小  |  中  |  大  |  超大  

js 事件监听最近在看zepto的源码在看的过程中,对于js事件监听一直云里雾里的,打算整理成文。

首先拿 key events and characters练习。html

<div> <input type="text" id="textBox"/> <p></p></div>

javascript

function init() { var inputElement = document.getElementById('textBox'), pElement = document.getElementsByTagName('p')[0]; inputElement.addEventListener('keydown', function () { pElement.textContent = inputElement.value.length; }); } window.addEventListener('load', init, false)

效果http://codepen.io/Yunkou/full/KtdwC/

在整个过程中(没有涉及到IE兼容),其实addEventListener三个参数中,前两个好理解,那么问题来了 false 做如何理解呢?

第二话 addEventListenerの第三个参数element.addEventListener(event, function, useCapture)

这个useCapture到底是个什么货。

第一个参数是需要绑定的事件,第二个参数是触发事件后要执行的函数。而第三个参数默认值是false,表示在事件冒泡的阶段调用事件处理函数,如果参数为true,则表示在事件捕获阶段调用处理函数。举个栗子。

那问题来了,到底啥是 时间冒泡和事件捕获?对于js小雏来说实在太难理解了。解惑js事件机制哪家强当然是 小胡子哥 解惑Javascript事件机制其实这篇也不错 但是稍微有点难度。

 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
© 2005- 王朝網路 版權所有 導航