backbone.js-이벤트, 클릭 된 항목 파악


96

내 backbone.js 뷰 클래스 중 하나에 다음과 같은 것이 있습니다.

...

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

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

...

내 페이지 당 마크 업은 다음과 같을 수 있기 때문입니다.

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

그렇다면 이벤트를 발생시킨 요소에 대한 정보를 정확히 어떻게 찾을 수 있습니까? 아니면이 경우 클릭 되었습니까?

답변:


132

일반적으로 이벤트 바인드에서는을 사용 $(this)하지만 Backbone 뷰가 this항상 뷰를 참조 하도록 설정되어 있다고 확신 하므로 다음을 시도하십시오.

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

정말 늦은 편집 : 아마 $(ev.currentTarget). 아래 pawlik의 답변에 대한 토론을 참조하십시오.


1
내가 맞다면 이것은 jquery 이벤트와 함께 작동합니다 (포스터가 요청한 이벤트). 그러나 백본의 trigger () 함수를 통해 트리거 된 이벤트는이 정보를 전달하지 않습니다 (대신 trigger ()를 호출 할 때 사용되는 인수를 제공합니다)
Jens Alm

1
@roufamatic — 실제로 표준 JavaScript 이벤트이기 때문에 BackboneJS의 범위를 벗어납니다. 이러한 문서에는 HTML이나 CSS에 대한 참조도 포함되어 있지 않습니다.
skalee 2012 년

1
"백본 뷰는 항상 뷰를 참조하도록 설정됩니다."— 이것은 객체로 정의 delegateEvents([events])되거나 events전달 된 이벤트에만 적용됩니다 Backbone.View.extend(배후에서 이전 방법을 사용함). 이니셜 라이저, 렌더링 메서드 등에 바인딩 된 이벤트에는 적용되지 않습니다.
skalee

98

ev.target오해의 소지가 있으므로 http://www.quirksmode.org/js/events_order.html에ev.currentTarget 설명 된대로 사용해야합니다 .


2
알아두면 좋겠지 만 IE에서 구현되지 않은 것 같습니다. 아니면 jQuery가이 문제를 해결하기 위해 정규화를 수행합니까?
Jamie Wong

2
jQuery를 같다는 모두 같은 ev.target 정규화 이벤트 초기화 DOM 요소 등과 ev.currentTarget 이벤트 버블 위상 내의 현재 DOM 요소 api.jquery.com/category/events/event-object
mikermcneil

6
나는 이것을 가지고 놀고 있었고 명확히하기 위해 아마도 ev.currentTarget을 원할 것입니다. 모든 jQuery 지원 브라우저에서 사용하기에 표준화되고 안전합니다.
mikermcneil 2011-08-16

4
예, target 대신 currentTarget을 사용하려고합니다. 예를 들어 하위 개체 "<a> <span> text </a>"가 포함 된 링크를 바인딩하면 대상이 <a>가 아닌 <span>을 가리킬 수 있습니다.
Evgenii

이것이 답이되어야합니다. event.target클릭 한 것만 얻을 수 있습니다.
Lorem

0

원하는 속성을 얻을 수 있습니다. ev 다음과 같이 작동합니다 this.

perpage: function(ev) {
        console.log($(ev.target).attr('name'));
}
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.