时间戳

首页 > 解决方案 > 将JS变量动态设置为单击锚的href

javascript - 将JS变量动态设置为单击锚的href

问题描述

我需要根据点击链接的 href 设置变量的值。

我知道我可以使用事件侦听器设置变量，该事件侦听器会在单击链接时运行它

var x = document.getElementById("myAnchor").href

但这被设置为单个元素。我需要它根据单击的链接动态工作。例如：

<a href="/link1">Partner A</a>
<a href="/link2">Partner B</a>
<a href="/link3">Partner C</a> 

// function to attach click event to all links
function attachClickEvent() {
  var linklist = document.getElementsByTagName('a');
  var listLength = linklist.length;
  var i = 0;
  for (; i < listLength; i++) {
    linklist[i].addEventListener("click", ClickedLinkEvent);
  }
}

window.onload = attachClickEvent;

// function that creates click event
function ClickedLinkEvent() {
  var anchor = obj.href;
  console.log(anchor);
  if (anchor.includes('clientdomain')) {
    //do nothing
  } else {
    SendLinkEvent();
  }
}

// function to run on click event
function SendLinkEvent() {
  ga('send', {
    hitType: 'event',
    eventCategory: 'Affiliate Link',
    eventAction: 'Click',
    eventLabel: anchor
  });
}

如果单击合作伙伴 A，则需要将锚变量设置为 /link1，如果单击合作伙伴 B，则需要将锚变量设置为 /link2。

那么，有没有办法用 vanilla JS 做到这一点？

标签： javascripthtml

解决方案

如果您调整ClickedLinkEvent方法声明并向方法签名添加参数，那么您将拥有事件对象。事件对象有一个目标参数。如果我理解正确，这就是你所需要的。不是吗？

function ClickedLinkEvent(e) {
    console.log('hello', e);
    var anchor = e.target.href;
    console.log(anchor);
    if (anchor.includes('clientdomain')){
       //do nothing
    }
    else {
         SendLinkEvent(anchor);
    }
}

推荐阅读