backbone.js - Ereignisse, die wissen, worauf geklickt wurde

In einer meiner Ansichtsklassen für backbone.j habe ich Folgendes:

...

events: {
  'click ul#perpage span' : 'perpage'
},

perpage: function() {
  // Access the text of the span that was clicked here
  // Something like: alert($(element).text())
},

...

weil mein Markup pro Seite so etwas haben könnte:

<ul id="perpage">
  <li><span>5</span></li>
  <li><span>10</span></li>
</ul>

Wie genau kann ich Informationen zu dem Element finden, das das Ereignis verursacht hat? Oder wurde in diesem Fall darauf geklickt?

— Matthew
quelle

Antworten:

132

Normalerweise würden Sie bei einer Ereignisbindung nur diese verwenden $(this), aber ich bin mir ziemlich sicher, dass Backbone-Ansichten so eingerichtet sind, dass sie sich thisimmer auf die Ansicht beziehen. Versuchen Sie also Folgendes:

perpage: function(ev) {
   alert($(ev.target).text());
}

REALLY LATE EDIT : Sie möchten wahrscheinlich verwenden $(ev.currentTarget). Siehe Diskussion über Pawliks Antwort unten

— Jamie Wong
quelle

Wenn ich richtig liege, funktioniert dies mit jquery-Ereignissen (nach denen das Poster gefragt hat). Beachten Sie jedoch, dass Ereignisse, die über die Trigger () - Funktion des Backbones ausgelöst werden, diese Informationen nicht enthalten (stattdessen erhalten Sie die Argumente, die beim Aufrufen von Trigger () verwendet werden)

— Jens Alm,

@roufamatic - da dies wirklich Standard-JavaScript-Ereignisse sind, liegt dies außerhalb des Bereichs von BackboneJS. Diese Dokumente enthalten weder Verweise auf HTML noch auf CSS.

— Skalee

"Backbone-Ansichten sind so eingerichtet, dass sie sich immer auf die Ansicht beziehen" - dies gilt nur für Ereignisse, die mit delegateEvents([events])oder mit übergebenem eventsObjekt definiert wurden Backbone.View.extend(wobei die frühere Methode hinter den Kulissen verwendet wird). Dies gilt nicht für Ereignisse, die im Initialisierer, in der

— Rendermethode

ev.targetkann irreführend sein, sollten Sie ev.currentTargetwie unter http://www.quirksmode.org/js/events_order.html beschrieben verwenden

— Pawlik
quelle

Gut zu wissen - aber es sieht so aus, als wäre es nicht im IE implementiert - oder führt jQuery eine Normalisierung durch, um dies zu beheben?

— Jamie Wong

Es sieht so aus, als würde jQuery sowohl ev.target als das das Ereignis initialisierende dom-Element als auch ev.currentTarget als das aktuelle DOM-Element innerhalb der Ereignisblasenphase api.jquery.com/category/events/event-object

— mikermcneil

Ich habe nur damit gespielt, und um das zu verdeutlichen, möchten Sie wahrscheinlich ev.currentTarget. Es ist normalisiert und für die Verwendung in allen von jQuery unterstützten Browsern sicher.

— Mikermcneil

Ja, Sie möchten currentTarget anstelle von target verwenden. Wenn Sie beispielsweise einen Link binden, der untergeordnete Objekte enthält, kann das Ziel "<a> <span> text </a>" auf <span> und nicht auf <a> verweisen.

— Evgenii

Dies sollte die Antwort sein. event.targetHolen Sie sich nur, was angeklickt wird.

— Lorem Ipsum Dolor

Sie können jedes gewünschte Attribut erhalten. ev funktioniert als this:

perpage: function(ev) {
        console.log($(ev.target).attr('name'));
}

— Nvan
quelle