Как получить элемент вызывающего абонента в функции href javascript?

Question

У меня есть элемент якорь тег приходит в HTML, как:

<a href="javascript:handleEvent(this, 'abc')"></a> 

Теперь в яваскрипте функции, я написал:

function handleEvent(sourceElement, txt) { 
    console.log(sourceElement); 
} 

утешаемого элемент подходит как окно в этом случае. Я попробовал sourceElement.document.activeElement, но он, похоже, не работает в chrome, где он приходит как элемент body.

Я не могу изменить структуру тега привязки на функцию onClick, поскольку это происходит из какого-то другого источника. Есть ли способ найти вызывающий элемент в этом сценарии?

Answer 1

Настоящий ответ заключается в том, чтобы изменить HTML, который, как вы сказали, вы не можете сделать. Я бы сказал, если сможешь. Если вы пишете эту функцию, а имя функции находится в HTML, как вы не можете изменить HTML?

Но если вы действительно, действительно не можете, вы можете обновить DOM, когда он загружен:

var list = document.querySelectorAll('a[href^="javascript:"]'); 
var x, link; 
for (x = 0; x < list.length; ++x) { 
    link = list[x]; 
    link.onclick = new Function(link.href.substring(11)); 
    link.href = "javascript:;"; 
} 

Live Copy | Live Source

Это довольно озорной, так как он использует Function конструктор (который очень похож eval), но если вы доверяете источник HTML, что должно быть в порядке.

Или, конечно, если вам не нужно использовать все, что было в href, просто подключите обработчик событий в приведенном выше коде и не используйте new Function.

Answer 2

Если у вас есть доступ к JS, вы могли бы сделать что-то вроде этого:

document.addEventListener('DOMContentLoaded', function(){ 
    var link = document.querySelectorAll('a'); 
    link[0].addEventListener('click', function(e){ 
     console.log(e.target); 
    }); 
}); 

С этим, вы бы просто не делать ничего с этим событием рядный href и быть просто добавив свой собственный обработчик.

Answer 3

попробовать что-то вроде этого, используйте jQuery

просто выберите ссылку тег с селектором

 $(function(){ 
      var href = $('a').attr('href'); 
      href = href.replace('javascript:',''); 
      $('a').attr('href','#'); 
      $('a').attr('onclick',href); 
     }) 

Это просто обходной путь решения.

Answer 4

И если нет другого ответа здесь не работает для вас потому вы не можете обновить DOM после его загрузки (попробуйте сделать любого из них, если вы хотите изменить squarespace lightbox - не сказать, что это невозможно, но ...) , вот из коробки мышление:

Иногда будет что-то намекающее где a href есть. Поэтому вы можете использовать его.

<div class="hint current"> 
    <a href="javascript:handleEvent('.hint')"> 

В моем случае, я даже не знал, намек, не нуждаясь параметр, который сделал вещи еще проще:

function handleEvent (hint) { 
    if(!hint) { 
     hint = $("div.current"); 
    } 
    hrefElement = $(hint).find('a[href^=javascript]'); 
} 

Это, конечно, будет иметь смысл, если ваш DOM постоянно изменяется с помощью сценария у вас нет доступа.

Но даже если нет ничего намекая на a href, вы могли бы сделать что-то вроде этого:

<a href="javascript:var x=1;handleEvent(1)"> 

function handleEvent (uniqueId) { 
    hrefElement = $('a[href^=javascript:var x='+uniqueId); 
}