Czy mogę się dowiedzieć z metody Javascript, kto \ który element DOM mnie wywoływał?

Question

<a onclick ="foo()" href="bar.html" >Link </a> 

<script> 

... 
function foo(){ 
    //I want to know the href property of whoever called me. 
    //something like this.caller.href ?? 
} 

</script> 

Chyba mógłbym przypisać wszystkie identyfikatory elementów, a następnie przekazać własny identyfikator do metody JS, do której dzwonię, ale szukałem lepszego sposobu.

Answer 1

Co powiesz na przekazanie argumentu?

foo(id); 

Answer 2

<a onclick="foo(this)" href="bar.html">Link</a> 

Następnie JavaScript byłoby:

function foo(ob) { 
    alert(ob.href); //or whatever you want to happen preferably pass an id 
} 

pomocą "to" selektor jeśli chcesz przekazać sam obiekt do funkcji.

Answer 3

Można by przekazać wartość atrybutu do funkcji href kiedy to się nazywa:

<a href="http://www.example.com" onclick="foo(this.href)">link</a> 

Answer 4

Gdy przeglądarka wywołuje funkcję jako skutek zdarzenia DOM, JavaScript przekazuje obiekt do tej funkcji, która zawiera informacje o wydarzeniu. Ale działa to trochę inaczej w IE niż inne. Aby działać we wszystkich przeglądarkach, foo() powinien podjąć argumentu * (używam e):

function foo(e) { 
    var sender = (e && e.target) || (window.event && window.event.srcElement); 
    //sender is the DOM element which was clicked 
    alert(sender.href); //assumes the clicked element was an <a> 
} 

Pierwsza linia przypisze „Nadawca” wartość elementu, który pochodzi zdarzenie we wszystkich przeglądarkach.

Teraz, jeśli <a>zawiera elementów podrzędnych (na przykład obraz) i jeden z tych była rzeczywista elementu kliknął, to staną się elementem „nadawca”. Jeśli jest to możliwe, trzeba chodzić DOM od nadawcy aż znajdziesz swój link:

function foo(e) { 
    var sender = (e && e.target) || (window.event && window.event.srcElement); 
    //sender is the DOM element which was clicked 

    var myEle = sender; 

    //find the parent node until we hit the <a> 
    while(myEle.tagName.toUpperCase() != 'A') { 
    myEle = myEle.parentNode; 
    } 

    //myEle is now the <a>. sender is still the originator. 
    alert(myEle.href); 
} 

* Można także uzyskać dostęp do argumentów przekazywanych do funkcji, nawet jeśli nie zostały one uznane, za pomocą tablica arguments[].

Answer 5

Nie trzeba przekazywać elementu jako argumentu do funkcji. można użyć

var a = event.srcElement; 
alert(a.href); 

Answer 6

Konwencja o to, że to odnosi się do elementu DOM, który program obsługi jest wywoływana na. Więc jeśli chcesz wiedzieć href linku:

function foo() { 
    // Inside foo this will refer to the DOM element if called as an event handler 
    var href = this.href 
} 

To powinno załatwić sprawę.

EDIT: Jeśli foo jest wywoływana z onclick-przewodnika wprost w DOM, tj

<a [...] onclick="foo()"> 

wówczas oryginalny kontekst to zostaną utracone wewnątrz foo. Aby rozwiązać ten jeden może wiązać wywołanie funkcji do oryginalnego kontekstu:

<a [...] onclick="foo.call(this)">