0

我正在尝试将swfupload.js注入 GWT 项目以支持多文件上传。我有一个在非 GWT 项目上本地运行的 swfupload.js 版本,但我很难将它集成到 GWT 项目中。

我怀疑 JS 在<span>元素存在于 DOM 之前被调用。JS 脚本在出现上传模式对话框时注入,在 swfupload.js > loadFlash() 处添加断点并检查targetElement当它应该是#btnFileUpload跨度时它返回为未定义。<span>此外,当脚本在断点处停止时,我可以看到屏幕上的显示。

  • 使用断点,$('#btnFileUpload')在控制台中查询我得到[].
  • 没有断点,$('#btnFileUpload') 在控制台中查询我得到<span id="btnFileUpload">...</span>.

GWT/Java 中的脚本注入器代码(据我所知)

@UiFactory
FormPanel createForm() {

    [...]

    String baseURL = GWT.getHostPageBaseURL();
    ScriptInjector.fromUrl(baseURL + "js/jquery.min.js").inject();
    String[] files = { 
        "swfupload.js", 
        "handlers.js", 
        "swfupload.queue.js",
        "fileprogress.js", 
        "swfupload.impl.js"
    };
    for (String file : files) {
        ScriptInjector.fromUrl(baseURL + "js/swfupload/" + file).inject();
    }

   [...]

}

JavaScript:swfupload.impl.js

var swfu;
$('#btnFileUpload').ready(function() {
    var settings = {
        button_placeholder_id: "btnFileUpload"
        [...]
    };
    swfu = new SWFUpload(settings);
}

JavaScript:swfupload.js

// Gets called from SWFUpload 'constructor'
SWFUpload.prototype.loadFlash = function () {
    var targetElement, tempParent;
    [...]
    // Get the element where we will be placing the flash movie
    targetElement = document.getElementById(this.settings.button_placeholder_id) || this.settings.button_placeholder;

    if (targetElement == undefined) {
        throw "Could not find the placeholder element: " + this.settings.button_placeholder_id;
    }
    [...]
};

注意:我知道 GWT 有一个 SWFUpload 的实现,但我宁愿不走那条路。

4

2 回答 2

2

当您使用ScriptInjector脚本时,会使用 an 添加到页面中,IFrame以便您的脚本在它们自己的浏览上下文中运行。document.getElementByIdin正在访问它的swfupload.js“自己的 DOM”,而不是顶级的。您可以尝试通过使用访问可能具有span您正在寻找的父上下文window.parent

于 2013-03-13T04:34:34.143 回答
0

这是一个将多个js加载到GWT中的示例

   ScriptInjector.fromUrl(GWT.getModuleBaseURL() + "lodash.js").setWindow(ScriptInjector.TOP_WINDOW)
            .setCallback(new Callback<Void, Exception>() {
                @Override
                public void onFailure(Exception reason) {
                    System.out.println("lodash loading failed");
                }

                @Override
                public void onSuccess(Void result) {
                    System.out.println("lodash loaded");
                }
            }).inject();
    ScriptInjector.fromUrl(GWT.getModuleBaseURL() + "jquery.js").setWindow(ScriptInjector.TOP_WINDOW)
            .setCallback(new Callback<Void, Exception>() {
                @Override
                public void onFailure(Exception reason) {
                    System.out.println("jquery loading failed");
                }

                @Override
                public void onSuccess(Void result) {
                    System.out.println("jquery loaded");
                }
            }).inject();
    ScriptInjector.fromUrl(GWT.getModuleBaseURL() + "backbone.js").setWindow(ScriptInjector.TOP_WINDOW)
            .setCallback(new Callback<Void, Exception>() {
                @Override
                public void onFailure(Exception reason) {
                    System.out.println("backbone loading failed");
                }

                @Override
                public void onSuccess(Void result) {
                    System.out.println("backbone loaded");
                }
            }).inject();

    ScriptInjector.fromUrl(GWT.getModuleBaseURL() + "joint.min.js").setWindow(ScriptInjector.TOP_WINDOW)
            .setCallback(new Callback<Void, Exception>() {
                @Override
                public void onFailure(Exception reason) {
                    System.out.println("joint.min loading failed");
                }

                @Override
                public void onSuccess(Void result) {
                    System.out.println("joint.min loaded");
                }
            }).inject();
于 2017-04-09T09:51:09.643 回答