2

我创建了一个使用jquery.tools.min.js库的简单 javascript。

我的 javascript 看起来像这样：

function testFunction() {
    $("img").click(function() {
        alert("Handler for .click() called.");
    });

    console.log("what's up?");
}

$(testFunction);

因此，当我在一个简单的 HTML 页面上尝试它时，我会在单击图像时收到警报消息。

我在我的 GWT 应用程序中添加了完全相同的 javascript。

当应用程序加载时，我会看到console.log消息，但是当我单击应用程序上的任何图像时，什么都没有发生。

为什么呢 ？是因为testFunction()不适用于动态创建的图像吗？还是因为事件被 GWT 覆盖了？

谢谢你。

编辑

创建内容后，我尝试调用函数：

public native final void recallFunction() /*-{
    $wnd.console.log('again1');
    $wnd.testFunction();
    $wnd.console.log('again2');
}-*/;

我可以看到我的日志消息，但没有触发点击事件。

编辑2：

当我运行时：

$("img").click(function() { 
    alert("Handler for .click()."); 
});

或者

testFunction();

直接在Firebug 的控制台中，该事件已正确附加到我的图像！

我也尝试调用testFunction()窗口的 onload 事件，但没有更好的运气。

4

4 回答 4

2

我假设您包含 jQuery 库本身，它是 1.7 或更高版本。

如果在定义 testFunction 时 DOM 中不存在图像，请使用“on()”。

function testFunction() {
$("img").on('click',function() {
    alert("Handler for .click() called.");
});

console.log("what's up?");
}
于 2013-01-04T02:08:24.790 回答
2

在 JSNI 代码中使用 jQuery 时，必须使用 $wnd.jQuery 或 $wnd.$ 而不是 $。另请参阅Google 网上论坛上的这个问题。

于 2013-01-04T10:19:42.120 回答
2

您可以轻松地从 gwtquery http://code.google.com/p/gwtquery/开始，而不是通过 Jquery 编写 JSNI

实际上，您将从 Jquery 方法和 GWT 性能优化中受益。

GwtQuery 优于 Jquery -

http://manolocarrasco.blogspot.in/2011/01/gwtquery-css-selectors-performance.html jQuery 与 GQuery 基准测试

此外，如果它只是你想要实现的漂亮滚动，你可以看看 - GWT CustomScrollPanel example and Custom Scrollbar in GWT

于 2013-01-04T03:35:14.577 回答
1

您是否向相关图像添加任何其他事件侦听器（以 gwt 为单位）？

只能有一个单击处理程序，如果您在两个环境中都设置它们，您将受到伤害。

正如另一条评论中提到的，Gwt-Query 可以很好地委托给 gwt 内部事件（因为它知道事件处理程序的语法）。

您可能希望对图像使用萤火虫对象检查。
试试 console.log($("img")) 看看你得到了什么。

在图像上查找 __listener 变量；那是gwt监听器。查看 DOMImplStandard ~line 200 以了解在 gwt 中接收事件时会发生什么。

我不确定 jquery 如何附加事件，但我确实在 mozilla 规范中看到了这一点：“如果在同一个 EventTarget 上使用相同的参数注册了多个相同的 EventListener，则会丢弃重复的实例。它们不会导致 EventListener 成为叫了两次，“

https://developer.mozilla.org/en/docs/DOM/element.addEventListener

于 2013-01-04T12:17:06.673 回答