использовать JavaScript для перехвата всех щелчков ссылок на документы - PullRequest
Новая
       25

использовать JavaScript для перехвата всех щелчков ссылок на документы

14 голосов
/ 26 января 2010

как перехватить щелчки по ссылкам в документе? он должен быть кроссплатформенным.

Я ищу что-то вроде этого: 

// content is a div with innerHTML
var content = document.getElementById("ControlPanelContent");

content.addEventListener("click", ContentClick, false);

 function ContentClick(event) {

    if(event.href == "http://oldurl")
  {
     event.href = "http://newurl";
  }
}

Заранее спасибо за помощь.

Ответы [ 3 ]

21 голосов
/ 26 января 2010 
for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){
    ls[i].href= "...torture puppies here...";
}

в качестве альтернативы, если вы просто хотите перехватить, а не изменить, добавьте обработчик onclick. Это будет вызвано перед переходом к URL: 

var handler = function(){
    ...torment kittens here...
}
for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){
    ls[i].onclick= handler;
}

Обратите внимание, что document.links также содержит AREA элементов с атрибутом href, а не только A элементов.

19 голосов
/ 09 ноября 2015

Как насчет случая, когда ссылки генерируются во время использования страницы?Это часто происходит с современными более сложными интерфейсами.

Правильное решение, вероятно, заключалось бы в том, чтобы поместить прослушиватель события click в документ.Это связано с тем, что события в элементах распространяются на их родителей, и потому что на ссылку фактически воздействует самый верхний родительский элемент.

Это будет работать для всех ссылок, независимо от того, загружены они со страницей или генерируются динамическипередний конец в любой момент времени. 

function interceptClickEvent(e) {
    var href;
    var target = e.target || e.srcElement;
    if (target.tagName === 'A') {
        href = target.getAttribute('href');

        //put your logic here...
        if (true) {

           //tell the browser not to respond to the link click
           e.preventDefault();
        }
    }
}


//listen for link click events at the document level
if (document.addEventListener) {
    document.addEventListener('click', interceptClickEvent);
} else if (document.attachEvent) {
    document.attachEvent('onclick', interceptClickEvent);
}
3 голосов
/ 08 октября 2012

Я только что узнал об этом, и это может помочь некоторым людям. В дополнение к перехвату, если вы хотите запретить ссылку для загрузки другой страницы или перезагрузить текущую страницу. Просто установите href на «#» (как во внутреннем префиксе ссылки на страницу). Теперь вы можете использовать ссылку для вызова функции, оставаясь на той же странице.

...