javascript - 如何实现 CSS3 GWT TransitionEnd 监听器

标签 javascript css gwt dom-events css-transitions

我想使用 transitionend Mozilla CSS3 属性在 CSS3 转换完成时触发事件。我知道我可以使用计时器来实现类似的功能,但本着 CSS3 动画的精神,让我们把它交给浏览器吧。这是一个 example正在执行此事件。

问题:GWT 2.4 在 DOM.setEventListener 中不支持此事件 supported event types .我尝试使用:

DOM.sinkBitlessEvent(element, "transitionend");

但是使用调试器发现它只支持(通过重新绑定(bind)):

  • dragenter
  • dragexit
  • 拖车
  • 放下

因此,缺少编写 native 事件处理程序 JSNI代码,这让我打开了 memory leaks ,如何监听 GWT 中不支持开箱即用的 GWT 元素上的事件?

作为引用,以下是 GWT 2.3 在 DomImplStandard.java 中为 gecko_1.8 排列构建的内容:

  protected native void sinkBitlessEventImpl(Element elem, String eventTypeName) /*-{
   if (eventTypeName == "dragenter")
      elem.ondragenter = @com.google.gwt.user.client.impl.DOMImplStandard::dispatchEvent;
    if (eventTypeName == "dragexit")
      elem.ondragexit  = @com.google.gwt.user.client.impl.DOMImplStandard::dispatchEvent;
    if (eventTypeName == "dragover")
      elem.ondragover  = @com.google.gwt.user.client.impl.DOMImplStandard::dispatchEvent;
    if (eventTypeName == "drop")
      elem.ondrop      = @com.google.gwt.user.client.impl.DOMImplStandard::dispatchEvent;
  }-*/

最佳答案

它接缝 mgwt管理转换事件(以及其他)。他们用自己的版本替换了 com.google.gwt.user.client.impl.DOMImpl。查看module descriptor . 但是看看他们的一个 DOMImpl(例如 DOMImplMobileSafari),他们编写了一个本地事件处理程序:

//transistion end
if (chMask & 0x8000000) {
    if(bits & 0x8000000){
        elem.addEventListener('webkitTransitionEnd', @com.google.gwt.user.client.impl.DOMImplStandard::dispatchEvent, false);
    }
}

我不明白他们是如何管理内存泄漏的。

关于javascript - 如何实现 CSS3 GWT TransitionEnd 监听器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8493571/

相关文章:

Javascript 在控制台中工作,但在内容脚本中不起作用

javascript - Nodejs/express - Router.use() 需要中间件功能,但有一个 ' + gettype(fn));

jquery - 无法使用 jQuery :last 调整表格单元格的右边距

gwt - 如何将现有的 JavaScriptObject 转换为 GWT 中的 java 原始类型?

javascript - 将元素/函数处理程序传递给 gwt 函数

Javascript - 在循环中选择 "not this"

javascript - 如何通过 Javascript 显示 .text 文件内容并更改样式?

css - 如何将一张 table 拉伸(stretch)到另一张 table 的高度?

java - GWT Twitter 分享按钮

javascript - HTML 页面中的多个 onclick 按钮