0

是否可以创建一个带有 2 个按钮（一进一GWT进）的水平面板JavaScript？

例如，我有这个对象：

HorizontalPanel panelHeader = new HorizontalPanel();

Button buttonexample = new Button();

现在，我.js用按钮创建了一个文件：

function javascriptbutton(){
    document.write('<input type="button" name="try" value="try">');
}

并创建了一个jsni方法来调用

public native static void javascriptTest() /*-{
    $wnd.javascriptbutton(); // JSNI 
}-*/;

我的问题是：如何jsni在水平面板上添加包含按钮的方法？通常GWT，我会这样做panelheadr.add(button)，但我怎样才能为javascript按钮做呢？

4

2 回答 2

0

您必须将 JS 与 HTML 分开。

在 GWT 中创建这两个按钮。为需要外部 JavaScript 的按钮分配一个 id。将点击处理程序附加到您的按钮，并从此点击处理程序调用您的本机 JS：

myButton.getElement().setId("jsButton");
myButton.addClickHandler(new ClickHandler() {

    @Override
    public void onClick(ClickEvent event) {
        // Here you call your JSNI native method
        javascriptTest();
    }

});

在你的原生 JS 方法中，你可以通过它的 id 来引用这个按钮。

于 2012-12-31T11:29:52.263 回答
0

在 javascript 中创建像 Button 这样的简单小部件并在 GWT 中使用应该是您最后的手段，而且很棘手，因为它可能会导致跨浏览器兼容性问题。此外，如果您必须调试该代码将很困难。无论如何，有一个更好的解决方案。

您的自定义按钮应该是一个 GWT 小部件，以便将其添加到布局容器中。这意味着按钮类应该至少实现IsWidget这允许将添加按钮的布局容器调用asWidget方法并为按钮返回一个简单的包装容器，从而使您可以轻松地布局按钮。以下示例使用 SimplePanel 作为包装器。

public class MyTextButton implements IsWidget, HasClickHandlers
{
    private SimplePanel panel = new SimplePanel();
    private Button button;
    public MyTextButton()
    {
        button = Button.create(panel.getElement());
    }

    @Override
    public Widget asWidget()
    {
        return panel;
    }
    //Use JavaScriptObject to create the DOM element for button which resides in the SimplePanel
    private static class Button extends JavaScriptObject
    {
        private static native Button create(Element parent)/*-{
            //create your javascript button here using parent element as the wrapper.
            //ex: if your function is correct
            //$wnd.javascriptbutton(parent);
        }-*/;
    }

    @Override
    public void fireEvent(GwtEvent<?> event)
    {
    }

    @Override
    public HandlerRegistration addClickHandler(ClickHandler handler)
    {
        //bind this handler to native button's onClick, return the registration for removal, on remove you need to reset the onClick
        return null;
    }
}

但理想情况下，如果您想获得内置功能，MyTextButton该类可以由任何其他特定类扩展。UIObject

于 2013-04-11T10:47:37.517 回答