本文仅针对个人遇到的情况为例,如果有更好的解决办法请指正。
我的应用场景是一个DataGrid嵌套在一个Div当中。DataGrid的id为EditTable,Div的id为window。如图:
我为DataGrid设置了OnSelect事件,当用户点击某一行的时候高亮显示。
<table id="editTable" class="easyui-datagrid" style="height: 280px"
data-options="url:'/zjwx/CustomDBIndex/getAllForEasyUI.koala',singleSelect: true,toolbar: '#editTableHead',
onSelect:OnSelected
">
然后给父Div绑定了click事件,目的是当点击父div空白处是,取消DataGrid的高亮显示。
现在基本功能说明清楚了,所以现在遇到的问题是,当我点击DataGrid的一行时,事件向上冒泡,又调用了父div的绑定方法,导致bug。在IE和Chrome浏览器下使用window.event取消冒泡是没问题的。但是在firefox下,事件event对象必须要靠参数传递,将event对象传递过来然后进行设置。查了easyui的官方文档,并没有找到OnSelect事件没有任何和event有关的参数,他只提供了两个传入参数,index和row。
因此,获取easyui事件中的event对象成了主要问题(在firefox下)。
网上查阅到,可以通过arguments.callee.caller.argument[0]可以获取event对象,但事实证明,OnSelect事件是easyui封装的事件,并没有在argument里把event带过来。于是经过多次试验,只要多加一层caller即可得到easyui在火狐下的event对象:arguments.callee.caller.caller.arguments[0]
解释:
arguments.callee是获得我自定义的事件处理方法OnSelected的方法体。
.caller是获得调用OnSelected的上层方法(easyui的内部方法)
.caller同理(在这一层里我发现了event对象)
最后使用.arguments[0]得到event对象,取消冒泡即可。