通过 ScriptInjector 注入 jQuery

Question

尝试通过ScriptInjector注入jQuery时，这是通过JSNI调用$wnd.$时抛出的错误：

原因：com.google.gwt.core.client.JavaScriptException： (TypeError): 对象 [object global] 没有方法 '$' 在 com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:248) 在 com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:136) 在 com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:561) 在 com.google.gwt.dev.shell.ModuleSpace.invokeNativeVoid(ModuleSpace.java:289) 在 com.google.gwt.dev.shell.JavaScriptHost.invokeNativeVoid(JavaScriptHost.java:107)

这里是注入 jQuery 的代码：

ScriptInjector.fromUrl("http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js")
            .setWindow(ScriptInjector.TOP_WINDOW).setCallback(new Callback<Void, Exception>() {
                @Override
                public void onSuccess(Void arg0) {
                    GWT.log("Success to load jQuery library");
                    ScriptInjector.fromUrl("http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js").setWindow(ScriptInjector.TOP_WINDOW).inject(); 
                }

                @Override
                public void onFailure(Exception arg0) {
                    GWT.log("Failed to load jQuery library");
                }
            }).inject();

可能是什么问题？

Answer 1

使用ScriptInjector.fromUrl() 加载外部javascript 文件是异步执行的，因此您可能正在尝试在加载jQuery 之前调用$wnd.$。延迟您的通话或使用onSuccess 继续您的应用程序的工作流程。

顺便说一句，如果你对在你的应用程序中使用 jquery-ui 感兴趣，你可以看看 Gwtquery-ui 插件，它会自动加载 javascript 依赖项，它不是一个纯粹的 gQuery 插件并且依赖于在 jQuery 和 jQuery-ui 上，但它与 gwt 和 gQuery 有很好的集成。

[编辑]

我最近添加到 gQuery (1.4.0-SNAPSHOT) 的一个新功能是 JsniBundle，用于将外部 javascript 作为 JSNI 块：

public interface JQuery extends JsniBundle {
   @LibrarySource("http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js")
   // You can use javascript files placed in your source tree as well
   // @LibrarySource("jquery.js")
   public void load();
}

// Generate the Bundle implementation
JQuery jQuery = GWT.create(JQuery.class);
// Load the third-party library
jQuery.load();

使用JsniBundle的目标是：

- 使用纯 javascript 文件，以便我们可以使用 IDE 进行编辑、格式化等， 而不是处理注释块中的代码。 - 在编译之前促进在浏览器中编写和测试 javascript。 - 包含第三方 javascript 库而不修改原始源。 - 无需在 html 页面或模块文件中添加 javascript 标签即可包含 第三方 JavaScript。 - 如果应用程序不使用任何 jsni 片段，GWT 编译器将删除它。 - 包含的 javascript 将利用 GWT jsni 验证器、混淆器 和优化器。

Answer 2

正确的语法是使用 $wnd.jQuery 而不是 $wnd.$ 我认为这与 $ 在 gwt iframe 中保留有关。

Answer 3

尝试在成功回调中加载你的jquery sn -p 代码，即当jquery lib 结束加载时。