0

我有一个具有checkout from billing功能的页面 - 基本上触发了一些 JS。

你可以在这里查看

选择 Blue & Small 并将其添加到您的购物车。

然后去结账。

输入一些虚拟数据,然后按“从计费中复制”。它行不通。但是,如果您刷新页面并再次执行该过程......它将起作用。

此外,您会注意到在第一次使用时,“运输方式”下拉菜单不起作用。但是,一旦你刷新,它确实如此。

我在控制台中尝试了负责此功能的 JS,它在第一次加载时运行良好。所以我知道代码是正确的(它试图选择的所有字段都是正确的,等等)。

我到底该如何调试呢?

4

4 回答 4

1

我能够验证您网站上的行为,并使其在页面的第一次加载时工作,只需稍作调整。我认为加载顺序是问题的核心。

在页面加载后,我可以通过重新运行 piggyback.js 文件中的第一行来使其工作。

这是显示问题和快速修复的快速截屏视频。

如果您可以在加载结束时运行此部分,我认为这会为您解决问题。

更新 1:您也可以关闭“继续结帐”按钮上的 turbolinks。当我将 data-no-turbolink="true" 添加到链接中,然后单击时,页面没有被涡轮加载,而是作为整页刷新加载。然后复制运输功能按预期工作。

更新 2:真正的问题很可能是您的 js 代码没有触发,因为它只需要一个 dom 就绪事件。您可以在 turbolinks 加载它时触发它,使用 page:load 事件,如此处所述

于 2013-04-26T03:19:33.100 回答
1

所以这就是正在发生的事情......

在购物车页面上,http://apt-605.herokuapp.com/checkout/cart您有“继续结帐”按钮,有一些 javascript 连接到所有锚标记,使用锚标记的 href 发出 ajax 请求,然后用从 ajax 接收的内容替换文档的内容称呼。

这是做什么的,新内容不会像新页面那样加载,头部永远不会渲染,而 piggybak js 永远不会加载。

您可以在购物车页面上验证这一点,让 firebug 保持打开状态,切换到 net 选项卡。现在,当您单击 Proceed to checkout 时,您会注意到发出了 XHR 请求 get checkout,并且结帐页面加载时没有刷新 net 选项卡。您也不会在 net 选项卡中看到 puiggybak js 加载。

所以基本上你必须弄清楚你在购物车页面上使用的将自己附加到所有锚标签的 js,我的猜测将是一个提供开箱即用的 ajaxified 导航的库。

希望这可以帮助。

于 2013-04-26T11:12:05.700 回答
0

我同意@Austin

剧本 <script src="/assets/piggybak/piggybak-application-1d1707f6934602bfae8e3a33d27a4a9b.js" type="text/javascript"></script>

最初加载页面时不会被调用,当您重新加载页面时,此链接会动态插入其中,您必须编写一些代码来处理该问题,如果可能,请显示该代码,以便我们进一步帮助您...

于 2013-04-26T08:36:52.227 回答
0

你在内容中进行ajaxing吗?

你的头不见了

<script src="/assets/piggybak/piggybak-application-1d1707f6934602bfae8e3a33d27a4a9b.js" type="text/javascript"></script>

首次加载页面时的 javascript 文件。

于 2013-04-18T23:44:43.393 回答