addEventListener的第三个参数详解
示例代码
element.addEventListener("mousedown", func, { passive: true });
element.addEventListener("mousedown", func, { passive: true });
element.addEventListener("mousedown", func, { capture: false });
element.addEventListener("mousedown", func, { capture: true });
element.addEventListener("mousedown", func, { passive: false });
element.addEventListener("mousedown", func, false);
element.addEventListener("mousedown", func, true);
参数详细解释
在addEventListener事件委托中第三个参数,可以设置为bool类型(useCapture)或者object类型(options)。
-
object类型(options)包括三个布尔值选项:
- capture: 默认值为false(即 使用事件冒泡).,true---使用事件捕获;
- once: 默认值为false,是否只调用一次,true---会在调用后自动销毁listener
- passive:不同浏览器默认值不同。true---listener永远不远调用preventDefault方法。根据规范,默认值为false. 但是chrome, Firefox等浏览器为了保证滚动时的性能,在Window,、Document、 Document.body上针对 touchstart 和 touchmove 事件将passive默认值改为了true, 保证了在页面滚动时不会因为自定义事件中调用了preventDefault而阻塞页面渲染。
-
bool类型(useCapture): 默认值为false(即 使用事件冒泡),与capture用法相同。
那么怎样与removeEventListener 方法合作呢?
只会检查addEventListener的 bool类型(useCapture)或者 object类型(options)值。