2013-11-09 4 views
0

когда я использую .preventDefault по ссылке, которая по-прежнему идет по ссылке - также это даже возможно с JS или это только метод jquery?JS .preventDefault не работает

var avoidlink = getElementsByTagName("a"); 

avoidlink.addEventListner("click",function(evt){ 
evt.preventDefault(); 
},false); 


<a href="http://www.google.com">Click here</a> 

ответ

2

три проблемы:

  • getElementsByTagName должны быть названы в документе или на элементе
  • Вы не можете добавить прослушиватель событий непосредственно в списке узлов, возвращенного getElementsByTagName, вы должны повторять над элементами, которые он содержит:
  • у вас есть опечатка в addEventListener

Вот фиксированный код:

var avoidlink = document.getElementsByTagName("a"); 
for (var i=0; i<avoidlink.length; i++) { 
    avoidlink[i].addEventListener("click",function(evt){ 
    evt.preventDefault(); 
    },false); 
} 

Если вы хотите, чтобы иметь возможность прикрепить прослушиватель событий в список узлов, вы можете обогатить NodeList.prototype:

NodeList.prototype.addEventListener = function(){ 
    for (var i=0; i<this.length; i++) { 
     Element.prototype.addEventListener.apply(this[i] , arguments); 
    } 
} 

Demonstration

Модификация прототипа объектов, которые вы не являетесь владельцами, обычно неодобрительно, но это изменение довольно безобидное и естественное.

0

Обычно, если многие элементы нуждаются в таком же слушатель событий можно добавить прослушиватель событий в контейнер и отфильтровать какой элемент вы хотели бы принять меры по следующим вопросам:

document.addEventListener("click",function(e){ 
    if(e.target,e.target.tagName.toLowerCase()==="a"){ 
    e.preventDefault(); 
    } 
}); 

Если вы должны были добавить дополнительные теги анкерные через скрипт они также вызовут preventDefault.

Смежные вопросы