为什么一条Javascript只在我下面有警报时才能工作？

Question

我有以下代码块来跟踪按钮上的点击,然后在mixpanel中记录分析.

<script type="text/javascript">
$('.buy').click(function() {
   var myPart = $('#part-name').text();
   var myDistributor = $(this).closest('tr').children('.distributor').text();
   mixpanel.track("Buy Part Link", {"PartName": myPart, "Distributor": myDistributor});
});
</script>

就其自身而言,不会在MixPanel中跟踪活动.但是,当我alert ('added');在mixpanel跟踪代码下添加时,突然间它完美运行.

为什么？

更新:由于有人问,警报被置于mixpanel.track命令下方.

Answer 1

我会猜测并说可能是因为你正在使用a标签,并且在脚本可以完成它之前页面是刷新的.

解决方案就是event.preventDefault在你的函数中使用,如下所示:

$('.buy').click(function(event) {
    event.preventDefault();
    //the rest of your code
});

默认情况下,a标记通常会导航到新页面(基于href属性).如果未href设置,则通常会重新加载当前页面.这是大多数人不常意识到的preventDefault功能.但添加此行可防止链接在任何位置导航.

正如@Esailija所说,如果你的点击功能中的所有代码同步运行,那么它会在页面导航之前完成,这表明它的一部分(最像是.track调用)是异步运行的 - 可能是通过计时器,或通过例如,ajax调用.

通常,当您发现警报会修复代码时,可能是因为某些内容没有足够的时间来完成.所以总是寻找可以结束脚本的东西,这很可能(在这种情况下)页面重新加载/刷新.

如果这不是问题,那么我们可能需要查看一些HTML以进一步提供帮助.

由于您的评论,您仍然想要导航,我做了一个非常快速的Google搜索,文档告诉您如何处理链接.查看此页面并向下滚动一下该mixpanel.track_links功能.