将监听器添加到SpanElement
问题内容:
我想将鼠标悬停在我创建的SpanElement的侦听器上:
SpanElement span = Document.get().createSpanElement();
span.setInnerText("my text");
我在Google中找到了如何使用Label-wrapper做到这一点,但我想在没有任何包装的情况下做到这一点。可能吗?
谢谢。
问题答案:
也可以不使用JSNI。
因此,与您的元素:
SpanElement span = Document.get().createSpanElement();
span.setInnerText("my text");
将事件侦听器直接添加到元素:
Event.sinkEvents(span, Event.ONCLICK);
Event.setEventListener(span, new EventListener() {
@Override
public void onBrowserEvent(Event event) {
if(Event.ONCLICK == event.getTypeInt()) {
//do your on click action
}
}
});
…而且看起来确实很丑陋;)正如您所注意到的那样,对于此元素构想的所有dom事件,事件侦听器都是“公共的”。因此,为确保处理正确的事件,您应在接收多个事件类型时检查事件类型(这次是开销,因为我们仅接收CLICK事件的位)。至于下沉->这将初始化该元素以参与gwt全局dom事件分发系统-
全局处理该事件以减少关闭次数,从而最大程度地减少旧版IE浏览器中的内存泄漏。还有一件事。您只能为每个元素设置一个事件监听器-
如果设置一个新的事件监听器,它将覆盖前一个监听器。所以我假设稍后您想将MOUSEOVER侦听器添加到您的跨度,而不是清除所有已添加的CLICK侦听器,您可能会执行以下操作:
//add mouseover event bit to existing sunk event bits
Event.sinkEvents(span, Event.getEventsSunk(span) | Event.ONMOUSEOVER);
final EventListener oldListener = Event.getEventListener(span);
Event.setEventListener(span, new EventListener() {
@Override
public void onBrowserEvent(Event event) {
if(Event.ONMOUSEOVER == event.getTypeInt()) {
//your mouseover action
}
if(oldListener != null) {
oldListener.onBrowserEvent(event);
}
}
});
或一次添加更多事件:
//add mouseover event bit to existing sunk event bits
Event.sinkEvents(span, Event.ONCLICK | Event.ONMOUSEOVER | Event.ONMOUSEOUT);
Event.setEventListener(span, new EventListener() {
@Override
public void onBrowserEvent(Event event) {
switch(event.getTypeInt()) {
case Event.ONCLICK:
break;
case Event.ONMOUSEOVER:
break;
case Event.ONMOUSEOUT:
break;
}
}
});
因此,在说完所有可能使用包裹您的跨度的标签小部件后,您就很满意了;)
Label.wrap(span).addClickHandler(new ClickHandler() {
@Override
public void onClick(ClickEvent event) {
//do your on click action
}
});
最后,即使您想进行DOM编程,也不要害怕小部件-
将它们视为类似于jquery节点包装器对象的东西。它们并不笨重,但可以提供很多动力。您还可以将小部件直接包装在现有DOM元素上,而无需将其附加到“面板基础结构”。