javascript - 将 javascript 添加到 GWT 中的 uiBinder 类，以便在上下文中使用 PaypalExpressCheckout

Question

我遇到了在 uibinder XML 中添加 javascript 的问题。我在 uibinder.java 中使用了 ScriptInjector，但它不起作用，因为在 Chrome 控制台上我收到错误:

IC_SETUP_CONTAINER_ERROR: Can't find element paypal

您可以忽略 href，我的目的是在弹出窗口中显示链接。这要归功于 Paypal 提供的 2 个 Javascript。

这些是重要的代码行:

openPopupExpressCheckoutPayPal.js:

window.paypalCheckoutReady=function(){
paypal.checkout.setup("2GF99****F66A",{
    locale: 'it_IT',
    environment:'sandbox',
    container:'paypal'
});
}   

计费页面.ui.xml

    <g:HTMLPanel>
      <div class="container">
        <a id='paypal' href="http://166.78.8.98/cgi-bin/aries.cgi?        sandbox=1&amp;direct=1&amp;returnurl=http://166.78.8.98/cgi-bin/return.htm&amp;cancelurl=http://166.78.8.98/cgi-bin/cancel.htm">  

    </a>
</div>
</g:HTMLPanel>

计费页面.java

public interface JsResources extends ClientBundle {
    final JsResources INSTANCE = GWT.create(JsResources.class);
    @Source("openPopupExpressCheckoutPayPal.js")
    TextResource scriptOpenPopupPaypal();
}
public BillingPage() {
    initWidget(uiBinder.createAndBindUi(this));
        .
        .
        .

    GWT.log("ScriptInject"+JsResources.INSTANCE.scriptOpenPopupPaypal().getText());
    ScriptInjector.fromString(JsResources.INSTANCE.scriptOpenPopupPaypal().getText()).inject();     
             ScriptInjector.fromUrl("http://www.paypalobjects.com/api/checkout.js").inject  ();


}

我认为我必须将脚本直接添加到 HTMLPanel 中，因为除非脚本找不到 id="paypal"但我不知道该怎么做。感谢关注!

此处引用:https://developer.paypal.com/docs/classic/express-checkout/in-context/integration/

Answer 1

createAndBindUi 将只构建 DOM 子树，但它不会附加到文档(并且可以通过 getElementById 访问)。只有当您的 BillingPage 小部件被添加到另一个小部件(递归地)添加到 RootPanel(或等效项)时，才会发生这种情况，也称为“附加”到文档.

这意味着您应该将 ScriptInjector 调用移动到小部件的 onLoad ，并确保您只执行一次，以防小部件稍后分离并重新附加(isOrWasAttached() 第一次应该为 false；否则使用您自己的 bool 标志).

您还必须将脚本注入(inject)您的 UI 所在的“顶部窗口”；默认情况下，ScriptInjector 将注入(inject) GWT 代码运行的隐藏 iframe:您必须将 .setWindow‌ (ScriptInjector.TOP_WINDOW) 添加到您的 ScriptInjector 通话。