从 gwt 调用 javascript 函数。 HTML窗格答案

【问题标题】：Call javascript function from gwt. HTMLPane从 gwt 调用 javascript 函数。 HTML窗格
【发布时间】：2013-02-19 17:29:43
【问题描述】：

我已经看到很多类似问题的答案，但没有找到我的问题的答案。有一个html页面。

<body>
  <div id="text">some text</div>
  <script>
     function hide()
     {
         document.getElementById("text").style.display = "none";
     }
  </script>
</body>

gwt中的代码

HTMLPane panel = new HTMLPane();
panel.setContentsType(ContentsType.PAGE);
panel.setContentsURL("pages/index.html");

public native void someMethod(HTMLPane panel)/*-{
    $doc.hide();
}-*/;

但是没有任何效果。试图将函数定义为

document hide = function hideF()
{
    document.getElementById("text").style.display = "none";
}

并在不同的位置定义一个函数，但没有任何帮助。请帮忙找出错误，或者说不可能

【问题讨论】：

告诉我们您正在使用 SmartClient 的 smartGWT 会有所帮助。我花了一段时间才找到对他们的 HTMLPane [smartclient.com/docs/8.3/a/b/c/go.html#class..HTMLPane].你知道有什么作用吗？可以在页面正文中调用隐藏函数吗？当您的 gwt 代码设置 Contents URL 时，您是否看到它加载了页面？调用someMethod 之前的行是否执行？

标签： javascript gwt smartgwt jsni

【解决方案1】：

hide() 是window 的成员——在调用本机方法中将$doc 替换为$wnd，即：

public native void someMethod(HTMLPane panel)/*-{
    $wnd.hide();
}-*/;

如果你坚持要附加到document，保持原生方法不变，但更正函数赋值：

document.hide = function()
{
    document.getElementById("text").style.display = "none";
}

【讨论】：

【解决方案2】：

问题是，当使用ContentsType.PAGE 时，HTMLPane 使用 iframe。
所以，hide() 是 iframe 中子窗口的一个函数。
如果您必须使用ContentsType.PAGE，请执行以下操作。

HTMLPane panel = new HTMLPane();
panel.setContentsType(ContentsType.PAGE);
panel.setContents("<iframe id='" + "id_internal_panel_1" + "' src='" + "pages/index.html" + "' style='border:none'/>");

// above use of iframe instead of using the one created by HTMLPane, could cause styling and other issues

// following did not work for me
// panel.setContentsURL("pages/index.html");
// panel.getElement().setId("id_internal_panel_1");
// panel.getElement().setPropertyString("name", "id_internal_panel_1");
// panel.getElement().setPropertyString("id", "id_internal_panel_1");

IButton button = new IButton("Hide");
button.addClickHandler(new ClickHandler() {
    public void onClick(ClickEvent clickEvent) {
        someMethod();
    }
});

public native void someMethod()/*-{
    $doc.getElementById("id_internal_panel_1").contentWindow.hide();
    // $wnd.document.getElementById("id_internal_panel_1").contentWindow.hide();

    // can use following with panel.setContentsURL("pages/index.html");, if ContentsType is not set to ContentsType.PAGE
    // $wnd.hide();
}-*/;

Set an ID to an iframe in a HtmlPane
Calling javascript function in iframe

使用“隐藏/文本”等过于笼统的名称可能会导致与其他脚本/对象发生冲突并导致奇怪的行为。

【讨论】：