如何从中删除重复项addEventListener。
我有一个网站，当用户拨打某些电话时，该网站使用ajax填充不同的div。我还具有一个Javascript函数，该函数可以捕获所有链接并创建一个，addEventListener以便我可以过滤网址，如果用户单击某些链接会发出警报。以下是我的Javascript函数，它创建了addEventListener：
function supportFunction() {
var myFunction = function(e) {
var regExp = new RegExp('//'+location.hostname+'($|/)');
var href = this.href;
if (regExp.test(href)) {
e.preventDefault();
alert('same domain link');
}
}
var links = document.querySelectorAll('a');
for (var i = 0; i < links.length; i++) {
links[i].addEventListener('click', myFunction);
}
}
我面临的问题是，在supportfunction()调用某些内容后，使用ajax填充了其中的内容，如果新填充的内容中存在任何链接，则不会将其添加到中addEventListener。我尝试在每次进行Ajax调用时调用supportfunction，但是在这种情况下，重复项会添加到eventlistener中。也就是说，如果某人单击相同的域链接，他们将收到2条警报，而在某些情况下将收到3-4条警报，具体取决于supportfunction()调用多少次。
我想我已经解释了，我的问题是什么。让我知道您是否需要有关该问题的更多解释。
我尝试用Google搜索答案，并找到了此链接http://dean.edwards.name/weblog/2005/10/add-event/，但无法弄清楚在我的情况下如何使用它。
注意：我正在寻找一个纯Javascript解决方案，而不是jQuery解决方案。（我希望我在这里不要求：））
您希望每个链接都被事件绑定到一次。您可以创建一个标志来标记它是否已被事件绑定。因此代码如下。
function supportFunction() {
var myFunction = function(e) {
var regExp = new RegExp('//'+location.hostname+'($|/)');
var href = this.href;
if (regExp.test(href)) {
e.preventDefault();
alert('same domain link'); }
}
var links = document.querySelectorAll('a');
for (var i = 0, len = links.length; i < len; i++) {
var link = links[i];
// make sure add-event only once
if(!link.getAttribute('data-added')) {
link.setAttribute('data-added', 1);
link.addEventListener('click', myFunction);
}
}
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句