从gwt调用javascript函数。 HTMLPane

Question

I've seen a lot of answers to a similar question, but have not found an answer to my question. 我已经看到了很多类似问题的答案，但没有找到我问题的答案。 There is a html page. 有一个html页面。

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

The code in gwt gwt中的代码

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

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

But nothing works. 但是没有任何效果。 Tried to define the function as 试图将功能定义为

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

and define a function in different positions, but nothing helped. 并在不同位置定义功能，但无济于事。 Please help find the error, or say that it is impossible 请帮助找到错误，或者说不可能

Answer 1

hide() is a member of window — replace $doc with $wnd in the calling native method, ie: hide()是window的成员—在调用的本机方法中将$doc用$wnd替换，即：

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

If you insist on attaching it to document , leave the native method unchanged, but correct the function assignment: 如果您坚持将其附加到document ，请保持本机方法不变，但要更正功能分配：

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

Answer 2

Problem is, HTMLPane uses an iframe when ContentsType.PAGE is used. 问题是，使用ContentsType.PAGE时，HTMLPane使用iframe。
So, hide() is a function of child window in iframe. 因此， hide()是iframe中子窗口的功能。
If you must use ContentsType.PAGE , following works. 如果必须使用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 在HtmlPane中将ID设置为iframe
Calling javascript function in iframe 在iframe中调用JavaScript函数

Using too generic names like "hide/text" could lead to conflicts with other scripts/objects and result in strange behavior. 使用过于通用的名称（例如“隐藏/文本”）可能会导致与其他脚本/对象发生冲突，并导致奇怪的行为。

从gwt调用javascript函数。 HTMLPane

问题描述

2 个解决方案

解决方案1
0 2013-02-21 09:12:41

解决方案2
0 2013-04-27 23:52:42

从gwt调用javascript函数。 HTMLPane

问题描述

2 个解决方案

解决方案1 0 2013-02-21 09:12:41

解决方案2 0 2013-04-27 23:52:42

解决方案1
0 2013-02-21 09:12:41

解决方案2
0 2013-04-27 23:52:42