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

96

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?

javascript jquery backbone.js underscore.js 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
1
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,
1
@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
1
"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
98

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

Pawlik
quelle
2
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
2
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
6
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
4
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
0

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

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