Question

我的电子商务网站有一个结帐页面。

尝试为客户添加选项以通过电汇向我们发送付款，但我需要自动在订单总额中添加25美元以支付费用。我想通过在购物车中添加产品来做到这一点。必须在不刷新页面的情况下完成此操作，因为刷新会重置某些客户选择选项（例如运送等）。

需要发布的网址是：

'add_cart.asp?quick=1&item_id=16'

目前我正在尝试使用iframe作为：

<script type="text/javascript">
    function toggleOnWireTransferFee() {
        if(document.getElementById('offline-42').checked) {
           var iframe = document.createElement('iframe');
           iframe.height=1;
           iframe.width=1;
           iframe.seamless;
           iframe.src='add_cart.asp?quick=1&item_id=16';
           document.body.appendChild(iframe);

           // this will refresh the entire page -- bad!
           //window.location='add_cart.asp?quick=1&item_id=16';
        }
    }
</script>

这会在页面底部创建一个1 x 1像素的iframe，对客户来说几乎是不可见的。它将产品添加到购物车中，当客户退房时，他们获得了为我们提供电力所需的总额。

问题是这会导致页面在加载iframe时跳转（将其置于焦点但是它是1x1并且几乎不可见，因此客户只会获得奇怪的体验）

有没有办法阻止页面的这种“跳跃”，或者我是否采取了错误的方式？

Answer 1

您尝试做的通常称为Ajax。现代浏览器有一个名为XMLHTTPRequest的对象，但更常见的是使用像jQuery这样的工具集，它可能如下所示：

$.ajax{
  url : 'add_cart.asp',
  data : {
    quick : 1,
    itemId : 16
  }
});

Answer 2

将其作为ajax风格的帖子。使用$ .post（或更好，$ .ajax，从那以后你可以添加错误处理）

在没有iframe的后台发布网址

2 个答案: