Ext.EventObject 的默认事件阻止

ExtJS中事件处理技巧

最新推荐文章于 2021-02-19 21:58:50 发布

最新推荐文章于 2021-02-19 21:58:50 发布 · 389 阅读

文章标签：

72 篇文章

订阅专栏

本文探讨了在ExtJS框架中如何有效处理事件，特别是如何阻止默认行为和事件冒泡。通过对比传统方法与现代方法，文章详细介绍了如何在不同场景下使用preventDefault和stopEvent方法。

我们知道对于事件处理，若想组织浏览器的默认事件处理程序运行，则可以在自定义的事件处理最后 return false;

如如果想要点击链接不跳转页面, 传统方式为

a.onclick=function() {
 //todo

  return false;
}

如果想用高级的方式，则要 ie 和 w3c实现区别

a.onclick=function(e) {
 var ev=e||window.event;

  if(ev.preventDefault)
      ev.preventDefault();
   else
      ev.cancel=true;

}

而对于 Extjs ，由于它给你的事件已经是包装过的事件，经试验并不支持传统的 return false; 方法。

如

Ext.get(a).on('click',function() {
//todo


//不行的，一样会跳转
return false;

});

分析它是注册 dom 事件处理时，对于我们提供的事件处理函数直接 handler(evt) ;而没有用 return handler(evt) ;所导致。

这也不是什么大问题，使用高级方法的话就不有问题了

Ext.get(a).on('click',function(e) {
//todo


//extjs 已经对ie兼容处理了
e.preventDefault();

});

ps : 一般来说我们要阻止默认事件的同时也要阻止事件冒泡，那么直接用 e.stopEvent() 就可以了。

关于右键阻止问题：

右键用 contextmenu 事件吧，click 用于左键点击事件，硬要判断那个鼠标键的话用

mousedown，不过右键是不能阻止

//没用，用 contextmenu 事件
Ext.get("resume_panel").on("mousedown",function(e){
if(e.button==2){
e.stopEvent();
}
});

Ext.EventObject 的 默认事件阻止