backbone.js - peristiwa, mengetahui apa yang diklik

96

Di salah satu kelas tampilan backbone.js saya, saya memiliki sesuatu seperti:

...

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

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

...

karena markup per halaman saya mungkin memiliki sesuatu seperti:

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

Jadi bagaimana tepatnya saya dapat menemukan informasi tentang elemen yang menyebabkan kejadian tersebut? Atau dalam hal ini, yang diklik?

Matthew
sumber

Jawaban:

132

Biasanya pada event bind, Anda hanya akan menggunakan $(this), tapi saya cukup yakin tampilan Backbone diatur sehingga thisselalu mengacu pada tampilan, jadi coba ini:

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

EDIT YANG BENAR-BENAR TERLAMBAT : Anda mungkin ingin menggunakan $(ev.currentTarget). Simak pembahasan jawaban pawlik di bawah ini

Jamie Wong
sumber
1
Jika saya benar, ini berfungsi dengan acara jquery (yang ditanyakan poster). Namun perlu dicatat bahwa peristiwa yang dipicu melalui fungsi trigger () tulang punggung tidak membawa informasi ini (sebaliknya memberi Anda argumen yang digunakan saat memanggil trigger ())
Jens Alm
1
@roufamatic - karena itu benar-benar kejadian JavaScript standar, jadi berada di luar cakupan BackboneJS. Dokumen tersebut tidak menyertakan referensi HTML atau CSS juga.
skalee
1
"Tampilan tulang punggung disiapkan sehingga ini selalu merujuk ke tampilan" - ini hanya berlaku untuk peristiwa yang ditentukan dengan delegateEvents([events])atau dengan eventsobjek yang diteruskan Backbone.View.extend(yang menggunakan metode sebelumnya di belakang layar). Ini tidak berlaku untuk acara yang terikat dalam penginisialisasi, metode render, dll.
skalee
98

ev.targetbisa menyesatkan, Anda harus menggunakan ev.currentTargetseperti yang dijelaskan di http://www.quirksmode.org/js/events_order.html

pawlik
sumber
2
Sebaiknya Anda tahu - tetapi sepertinya itu tidak diterapkan di IE - atau apakah jQuery melakukan normalisasi untuk memperbaikinya?
Jamie Wong
2
Sepertinya jQuery menormalkan kedua ev.target sebagai elemen dom yang menginisialisasi acara dan ev.currentTarget sebagai elemen DOM saat ini dalam fase gelembung peristiwa api.jquery.com/category/events/event-object
mikermcneil
6
Saya baru saja bermain-main dengan ini, dan untuk mengklarifikasi, Anda mungkin menginginkan ev.currentTarget. Ini dinormalisasi dan aman untuk digunakan di semua browser yang mendukung jQuery.
mikermcneil
4
Ya, Anda ingin menggunakan currentTarget, bukan target. Misalnya, jika Anda mengikat tautan yang berisi objek turunan "<a> <span> teks </a>", target bisa mengarah ke <span> dan bukan <a>.
Evgenii
Ini harus menjadi jawabannya. event.targethanya memberi Anda apa yang diklik.
Lorem
0

Anda bisa mendapatkan atribut apa pun yang Anda inginkan. ev bekerja sebagai this:

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