Wie erhalte ich das aufrufende Objekt onclick?

Ich brauche einen Handler für das aufrufende Objekt des onclickEreignisses.

<a href="123.com" onclick="click123(event);">link</a>

<script>
  function click123(event) {
    //i need <a> so i can manipulate it with Jquery
  }
</script>

Ich möchte dies ohne die Verwendung von $().clickoder $().livevon jQuery tun, aber mit der oben beschriebenen Methode.

Übergeben Sie thisden Inline-Click-Handler

<a href="123.com" onclick="click123(this);">link</a>

oder event.targetin der Funktion verwenden (gemäß dem W3C DOM Level 2 Event-Modell )

function click123(event)
{
    var a = event.target;
}

Aber natürlich ist IE anders , also ist die Vanille-JavaScript-Methode, um damit umzugehen

function doSomething(e) {
    var targ;
    if (!e) var e = window.event;
    if (e.target) targ = e.target;
    else if (e.srcElement) targ = e.srcElement;
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;
}

oder weniger ausführlich

function doSomething(e) {

    e = e || window.event;
    var targ = e.target || e.srcElement || e;
    if (targ.nodeType == 3) targ = targ.parentNode; // defeat Safari bug
}

Wo eist das event object, was in anderen Browsern als dem IE an die Funktion übergeben wird?

Wenn Sie jedoch jQuery verwenden, würde ich unauffälliges JavaScript dringend empfehlen und jQuery verwenden, um Ereignishandler an Elemente zu binden.

Am einfachsten ist es, dies an die Funktion click123 zu übergeben, oder Sie können auch Folgendes tun (browserübergreifend):

function click123(e){
  e = e || window.event;
  var src = e.target || e.srcElement;
  //src element is the eventsource
}

http://docs.jquery.com/Events/jQuery.Event

Versuche es mit event.target

Enthält das DOM-Element, das das Ereignis ausgegeben hat. Dies kann das Element sein, das für das Ereignis registriert wurde, oder ein untergeordnetes Element davon.

Ich denke, der beste Weg ist, die currentTarget- Eigenschaft anstelle der target- Eigenschaft zu verwenden.

Die schreibgeschützte Eigenschaft currentTarget der Ereignisschnittstelle identifiziert das aktuelle Ziel für das Ereignis , wenn das Ereignis das DOM durchläuft. Es bezieht sich immer auf das Element, an das der Ereignishandler angehängt wurde, im Gegensatz zu Event.target, das das Element identifiziert, bei dem das Ereignis aufgetreten ist .

Zum Beispiel:

<a href="#"><span class="icon"></span> blah blah</a>

Javascript:

a.addEventListener('click', e => {
    e.currentTarget; // always returns "a" element
    e.target; // may return "a" or "span"
})

Die Sache mit Ihrer Methode ist, dass Sie Ihr HTML mit Javascript überladen. Wenn Sie Ihr Javascript in eine externe Datei einfügen, können Sie unauffällig auf Ihr HTML zugreifen, und das ist viel ordentlicher.

Später können Sie Ihren Code mit addEventListener / attackEvent (IE) erweitern, um Speicherverluste zu vermeiden.

Dies ist ohne jQuery

<a href="123.com" id="elementid">link</a>

window.onload = function () {
  var el = document.getElementById('elementid');
  el.onclick = function (e) {
    var ev = e || window.event;
    // here u can use this or el as the HTML node
  }
}

Sie sagen, Sie möchten es mit jQuery bearbeiten. Sie können also jQuery verwenden. Dann ist es noch besser, es so zu machen:

// this is the window.onload startup of your JS as in my previous example. The difference is 
// that you can add multiple onload functions
$(function () {
  $('a#elementid').bind('click', function (e) {
    // "this" points to the <a> element
    // "e" points to the event object
  });
});