SmartGWT / GWT 通过 javascript 访问构造函数中创建的 div答案

【问题标题】：SmartGWT / GWT accessing div created in constructor via javascriptSmartGWT / GWT 通过 javascript 访问构造函数中创建的 div
【发布时间】：2013-08-07 09:30:10
【问题描述】：

我正在尝试将自定义 javascript 库与我的 SmartGWT 项目集成。

我的页面区域通过按钮单击动态加载，因此在 Java 代码中我有类似以下伪代码的内容：

button . onClick {
    contextArea = new contextAreaTypeA()
}

所以我的 contextAreaTypeA 已创建，我想在构造函数中创建一系列 div 元素，为它们分配 ID，然后在我的自定义库中调用一个函数，将内容加载到这些 div 中。

SmartGWT 摆脱了获取 ID 或在页面中的任何元素上设置 ID 的任何方式，要在元素上创建 ID，您必须创建自己的小部件并覆盖 getInnerHtml 或创建类似 HTMLFlow 的东西并添加myflow.setContent('<div id="myID" ></div>'); 之类的内容，我就是这样做的。

我的问题是，在构造函数中执行此操作意味着当我调用带有 ID 的自定义 javascript 函数时，我创建的这个 div 似乎还没有附加到 dom，所以我总是得到一个空指针。

由于我的模块和文档已加载，并且此内容正在动态添加，因此我无法调用文档就绪或 onModuleLoad，因此我应该如何以及何时检测我的 div 的负载以及何时可以安全访问来自 JSNI 调用中的 div？

我尝试了多种方法，例如添加附加处理程序（它们似乎从未被调用），我尝试将绘制处理程序添加到 HTMLFlow，但它们似乎在绘制 htmlflow div 之后但在实际绘制内容之前被调用.我曾尝试在 HTMLFlow() 上调用重绘，但这似乎根本没有调用 onDraw 方法。

我不知道如何将这个库与我的 SmartGWT 集成，如果有人能提出更好的（或任何）方法，那就太好了。

【问题讨论】：

标签： javascript html gwt smartgwt

【解决方案1】：

在一个普通的 GWT 中覆盖Widget.onAttach() 为我做这个伎俩：

public class MyWidget extends Widget {

    @Override
    protected void onAttach() {
        super.onAttach();
        // Call your JSNI code
    }

}

重要的事情：

关注super.onAttach()来电。它必须在在您的 JSNI 调用之前触发。
图像将在之后 onAttach() 加载。因此，如果您的 JS 代码对图像进行一些技巧（例如检查它们的高度），那么它会为时过早。

【讨论】：

这个问题是 onAttach 似乎永远不会为 SmartGWT 小部件触发。例如，当附加 HTMLFlow 时，不会触发 onAttach 方法。我不知道为什么。其次，被附加意味着它会被附加，但不一定是它的内容。
奇怪。对于 GWT，请致电 super.onAttach() 表示附上我和所有孩子。
是的，onDraw 是在绘制元素时触发的，但似乎在绘制 HTMLFlow 的内容之前，所以它仍然有同样的问题。我可以尝试覆盖 getInnerHTML 并这样做，而不是在 HTMLFlow 中嵌入 div

【解决方案2】：

原来我以为自己遇到的问题根本不是问题，实际上是完全不同的问题。

onAttach() 仍然没有触发，因为我似乎无法解决问题，但是在 drawHandler 中执行所有操作都可以正常工作。

我的引用显示为 null 的原因是，当我试图访问我正在使用的 javascript 中的元素时

document.getElementById("myDiv");

而我应该一直在使用

$wnd.document.getElementById("myDiv");

这取决于我相信 GWT 在 iframe 中将脚本装箱的方式（我的理解是脚本可以在运行时动态注入？但我可能错了）。

【讨论】：