在HTML中添加onclick和从Javascript调用会发生冲突吗？

我有一个锚链接，它附带了一个onclick事件。基本上，点击它就会打开一个Facebook共享弹出窗口

<a target="_blank" 
   href="https://www.facebook.com/sharer/sharer.php?u=MYLINK" 
   onclick="javascript:window.open(this.href,'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"
>Share on Facebook</a>

其中，

单击

和

导航按钮

值将通过HTML5数据变量动态插入。（将连接到锚上）

如何整合整件事？两个onclick事件有效吗？还是只有一个有效？

---

实现这一点的最佳方式是什么。请指导。

由于您使用的是Jquery，因此不需要在achors上使用onClick事件，这将使html代码更干净：

$('.track').click(function (e) {
    var target = $(e.target);
    ga('send', 'event', 'button', target.data('event'), target.data('label');
    if(target.hasClass('facebook') {
        window.open(target.attr('href'),'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');
    }
    e.preventDefault();
});


<a target="_blank" class="track facebook" href="https://www.facebook.com/sharer/sharer.php?u=MYLINK" 
  data-event="click"
  data-label="nav-buttons"
>Share on Facebook</a>

$（'.track'）。单击（函数（e）{
var目标=$（e.target）；
ga（'send'，'event'，'button'，target.data（'event'），target.data（'label'）；
if（target.hasClass（'facebook'））{
open（target.attr（'href'），''，'menubar=no，toolbar=no，resizeable=yes，scrollbars=yes，height=600，width=600'）；
}
e、 预防默认值（）；
});

由于您使用的是Jquery，因此不需要在achors上使用onClick事件，这将使html代码更干净：

$('.track').click(function (e) {
    var target = $(e.target);
    ga('send', 'event', 'button', target.data('event'), target.data('label');
    if(target.hasClass('facebook') {
        window.open(target.attr('href'),'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');
    }
    e.preventDefault();
});


<a target="_blank" class="track facebook" href="https://www.facebook.com/sharer/sharer.php?u=MYLINK" 
  data-event="click"
  data-label="nav-buttons"
>Share on Facebook</a>

$（'.track'）。单击（函数（e）{
var目标=$（e.target）；
ga（'send'，'event'，'button'，target.data（'event'），target.data（'label'）；
if（target.hasClass（'facebook'））{
open（target.attr（'href'），''，'menubar=no，toolbar=no，resizeable=yes，scrollbars=yes，height=600，width=600'）；
}
e、 预防默认值（）；
});

最好的办法是从

onclick

中删除内容，并对两者使用相同的方法，即使用jQuery添加事件侦听器

$('.track').click(function(e){
  e.preventDefault();
  ga('send', e.type, 'button', 'click', 'nav-buttons');
});

$('a.facebookshare').click(function(e){
  e.preventDefault();
  window.open(this.href, '',
    'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600'
  );
});

因此，您将使用以下标记：

<a target="_blank" class="track facebookshare"
  href="https://www.facebook.com/sharer/sharer.php?u=MYLINK" 
  data-label="nav-buttons"
  >Share on Facebook</a>

我已经删除了

数据事件

，因为您可以从事件对象本身读取它

---

不久前，我在类

ga track

中实现了一个类似的功能，然后我通过一个GUI公开了这个功能，允许站点所有者轻松地为几乎任何东西设置跟踪事件……简单地说，这是一个很好的方法，可以使跟踪保持通用性，以便可以在任何您希望的地方应用它。

第一种方法是从

onclick

中删除内容，并对两者使用相同的方法，即使用jQuery添加事件侦听器

$('.track').click(function(e){
  e.preventDefault();
  ga('send', e.type, 'button', 'click', 'nav-buttons');
});

$('a.facebookshare').click(function(e){
  e.preventDefault();
  window.open(this.href, '',
    'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600'
  );
});

因此，您将使用以下标记：

<a target="_blank" class="track facebookshare"
  href="https://www.facebook.com/sharer/sharer.php?u=MYLINK" 
  data-label="nav-buttons"
  >Share on Facebook</a>

我已经删除了

数据事件

，因为您可以从事件对象本身读取它

---

---

不久前，我在类

ga track

中实现了一个类似的功能，然后我通过一个GUI公开了这个功能，允许站点所有者轻松地为几乎任何东西设置跟踪事件……简单地说，这是一个很好的方法，可以使跟踪保持通用性，以便可以在您希望的任何地方应用它。

m是我有另一个按钮，用于Twitter共享，它不需要

窗口。打开
部分。那么，如何使代码可用于我想要跟踪的所有锚链接，而不管是否有
窗口。打开
与否。看起来很棒。我不应该使用
目标.data（'event'）
和
目标.data（'label'）吗
获取HTML5数据参数？另一个简单的问题。我应该让弹出窗口先打开而不是ga数据先出来吗？这对用户来说会更快吗？我认为这没有任何区别。所以你可以这样做。好的，这取决于ga函数，所以你是对的，最好先打开弹出窗口。问题是我有一个另一个按钮是用于Twitter共享的，它不需要
窗口。打开
部分。那么，如何使代码可用于我想要跟踪的所有锚链接，而不管是否有
窗口。打开
。看起来很棒。我不应该使用
target.data（'event'）
和
target.data（'label'）吗
获取HTML5数据参数？另一个简单的问题。我应该让弹出窗口先打开而不是ga数据先出来吗？这对用户来说会更快吗？我认为这不会有任何不同。所以你可以这样做。好的，这取决于ga功能，所以你是对的，最好先打开弹出窗口这看起来很好谷歌标签管理器，我们也可以。但我对标签管理器还不是很熟悉，也不想弄乱数据。@LittleLebowski是的，这是在谷歌所有新奇的东西之前：）还没有使用GTM，但它看起来不错。是的，它看起来不错。缺乏好的文档：（顺便说一句，你对上面的@bingjie2680答案有什么看法。它和你现在做的很相似，但是它没有使用另一个点击事件，而是使用了一个“如果”。看起来更好？有什么想法吗？@LittleLebowski well Bingjie在帖子中击败了我：）哪一个答案真的只是个人偏好。我喜欢把事情分开，并意识到其他共享链接的可能性…尽管imo（+1），Bingjie应该得到公认的答案我已经说过了。让我试试你的方法。我看起来也更模块化了。谷歌标签管理器看起来很棒，我们也可以做到。但我对标签管理器还不是很舒服，不想弄乱数据。@LittleLebowski是的，这是在谷歌所有新奇的东西之前：）还没有使用GTM，但它看起来不错。是的，它看起来不错。缺乏好的文档。：（顺便说一句，你对上面的@bingjie2680答案有什么看法。这与你正在做的类似，但它使用了一个“如果”。看起来更好吗？有什么想法吗？@LittleLebowski well Bingjie在帖子中击败了我：）哪一个答案真的只是个人偏好。我喜欢把事情分开，并意识到其他共享链接的可能性……尽管我已经给出了imo（+1）的答案，但Bingjie值得接受。让我试试你的方法。我看起来也更模块化。