按钮onclick和href之间的区别

时间:2016-03-01 04:05:19

标签: javascript gwt smartgwt jsni

我正在尝试将SendOwl购物车集成到我的应用程序中(应用程序的详细信息在最后)。

为了演示问题,我使用纯HTML / Javascript创建了一个简单的代码段。在HTML的head部分,我有这个:

<script type="text/javascript">
    function SendOwl(url) {                 
        window.location.href=url;
    }
</script>
<script type="text/javascript" src="https://transactions.sendowl.com/assets/sendowl.js" ></script>

在身体里我有这个:

示例1:在自己的窗口中打开结帐表单(不期望的行为):

<input type="button" onclick="SendOwl('https://transactions.sendowl.com/products/8/5C080C0F/purchase');" value="On Click" />

屏幕截图1:注意URL已更改且不是叠加层(与2相比)。

enter image description here

示例2:在模态窗口中打开结帐表单作为叠加层(所需行为):

<a href='https://transactions.sendowl.com/products/8/5C080C0F/purchase'>a href</a>

屏幕截图2:网址保持不变,但表格会以叠加方式打开。

enter image description here

您还可以在SendOwl的演示页面上看到现场演示。

我的应用程序基于GWT(准确地说是SmartGWT)。在我的应用程序中,我调用按钮onclick处理程序来调用使用JSNI调用调用立即购买链接的Javascript(如下所示)。但是,“立即购买”链接始终在完整窗口中打开,如上面的示例1所示。

public static native void onBuyNowClick(String url) /*-{
  $wnd.SendOwl(url);
}-*/;

我尝试过$wnd.open(url),但行为相同。

如何让第一个示例表现得像第二个但仍然使用按钮onclick?

更新:

魔术在sendowl.js脚本中。如果我删除该脚本,则两个示例的工作方式相同。如果我能弄清楚该脚本的工作原理,可能会提供一些线索,使示例1的工作方式与示例2相同。

感谢。

3 个答案:

答案 0 :(得分:1)

我已经通过探究sendowl.js解决了这个问题。这是完成所有魔术的剧本。

这是我修改后的脚本,它使示例1与示例2完全相同:

<script>
    function SendOwl(url) { 
        sendOwl.addLoadingImage();
        sendOwl.loadIframe ('https://transactions.sendowl.com/products/8/5C080C0F/purchase');
    }
</script>
<script src="https://transactions.sendowl.com/assets/sendowl.js"></script>  

感谢所有回复并试图提供帮助的人。

答案 1 :(得分:0)

您只需要:

<script type="text/javascript" src="https://transactions.sendowl.com/assets/sendowl.js" ></script>
<a href="https://transactions.sendowl.com/products/8/5C080C0F/purchase" rel="nofollow"><input type="button" value="Purchase" /></a>

https://help.sendowl.com/help/article/link/button-codes-to-sell-your-product

对我来说很好。
enter image description here

答案 2 :(得分:0)

在GWT中,您可以使用PopupPanel来显示叠加层。就个人而言,我从未尝试在弹出窗口中嵌入页面,但您可以尝试在弹出式面板中添加Frame对象,如下所示:

PopupPanel popup = new PopupPanel();
Frame frame = new Frame("http://www.yourlink.com/");
popup.setWidget(frame);
popup.setGlassEnabled(true);
popup.center();

关于网址,请查看documentation和此thread