添加任何额外的JavaScript正在打破jQuery模式内的功能

我有一个由别人创建的页面，其中包含模态窗口，每个模态窗口都有悬停时显示的链接/图像。仅供参考，我对JavaScript和jQuery的理解非常有限。添加任何额外的JavaScript正在打破jQuery模式内的功能

我想要实现的是将Google Analytics事件标记添加到模态窗口中的链接。它可以与onclick（下面的代码）直接添加到锚标签，或者如果它通过jQuery/JavaScript添加到链接）。该事件需要在Google Anayltics中作为点击事件触发。

通常情况下，我只需要添加：

onclick="_gaq.push(['_trackEvent','Parameter 1', 'Parameter 2', 'Parameter 3']);"

直接到锚标记，但每当我把代码添加到HTML中的锚标记，jQuery的停止工作。模式窗口在此链接上正常工作： http://cookware.lecreuset.com/cookware/content_cast-iron-guide-sizes_10151_-1_20002

您可以看到我的意思是“停止工作”在以下链接 - 列表标记中的项目不再被填充，这意味着图标不会被填充， t显示并且无法访问悬停时显示的新内容：http://cookware.lecreuset.com/cookware/content_test-form_10151_-1_20002

由于大多数链接都是在jQuery中创建的，因此我尝试通过.click，.attr，...添加Google Tag。并没有运气。上面的链接显示了我对.click函数的尝试（搜索CIGuide，您可以在第二个链接的源代码中找到它），但是无论我将哪个JavaScript添加到页面，它都以相同的方式打破。我的原始问题在这里：Not able to successfully add Google Analytics Event Tag to link created by .attr

在我无法让这两件事情都起作用之后，我决定尝试在我提供的所有内容之外的页面上尝试一个简单的警报，使用它自己的JavaScript标签，只是为了看看我能否得到这个工作。它工作完美，但模式功能仍然打破。

我已经能够成功地将Google标记添加到顶部导航中的锚点以及页面左侧和右侧的箭头。但是，无论何时，我都会尝试标记其他任何内容，这会中断。

我正在使用的代理机构能够将Google标记添加到锚点，而不会在他们的服务器上进行测试时出现问题，并且如果我在本地计算机上测试它，则能够看到事件触发。我必须假设我的服务器或OpenCMS存在问题。但是，我没有在任何浏览器/调试器中看到任何错误消息，并且我已经使用JSLint验证了我的脚本添加，并且所有内容都会检出。

这让我疯狂！任何人都可以帮助我找出为什么这不起作用，以及如何添加事件标签到页面？

来源

2012-12-19 surfbird0713

所以如果我设法调用'alert'并且悬停功能仍然有效，你会很高兴吧？ – EricG

如果你能够做到这一点，将有助于我回答为什么在网页中添加任何内容时中断它，那么是的，先生。 – surfbird0713

我也尝试将_gaq.push调用更改为console.log，以查看它是否仍然会中断，并且确实如此。 – surfbird0713

不完全确定你想要达到的目标，以及它是否可行。

$(document).ready(function() { 

    $("#modal_sizes_1 a").each(function(index, elem) { 

     $(elem).click(function() { 

      _gaq.push(['_trackEvent','Parameter 1', 'Parameter 2', 'Parameter 3']); 
     }); 
    }); 
});

更新
好了，所以我认为这是有关这一行：

<a 
    href="/cookware/content_cast-iron-guide-about_10151_-1_20002" 
    title="About Cast Iron" 
    onclick="_gaq.push(['_trackEvent','CIGuide', 'Click', 'About Cast Iron']);" 

>About Cast Iron</a>

而且我会努力改变它像这样

<a 
    href="/cookware/content_cast-iron-guide-about_10151_-1_20002" 
    title="About Cast Iron" 
    onclick="setTimeout(function(){ 
     _gaq.push(['_trackEvent','CIGuide', 'Click', 'About Cast Iron']); 
    },0);" 

>About Cast Iron</a>

甚至使延迟比0长，比如10或50。

来源

2012-12-19 21:26:55 EricG

我正在尝试将_gaq推送调用添加到链接，但是无论何时添加任何其他脚本到页面，模式窗口中的内容都会停止工作，无论是将其添加到现有功能还是在其自己的脚本标记中。我会更新我的问题，澄清我想达到的目标。 – surfbird0713

好的。我无法找到您建议搜索的“CIGuide”。 – EricG

你看第2个网址吗？它应该在那里：http://cookware.lecreuset.com/cookware/content_test-form_10151_-1_20002 – surfbird0713

您可以对GA推送方法使用回调并添加超时。在你的情况下，尝试这样的事情：

var submitBtn = $('.submit-btn'); 

submitBtn.on('click', function(e) { 
    var that = this; 

    if (typeof _gaq != 'undefined') { 
     e.preventDefault(); 

     _gaq.push(['_trackEvent','Parameter 1', 'Parameter 2', 'Parameter 3'], function() { 
      setTimeout(function() { 
       window.location = $(that).attr('href'); 
      }, 100); 
     }); 
    } 
});

来源

2013-07-11 23:15:43 Ben

添加任何额外的JavaScript正在打破jQuery模式内的功能

回答

相关问题