live()와 함께 사용하기 위해 jQuery에서 사용자 정의 이벤트 트리거

Question

본질적으로 모바일 브라우저의 이벤트 역할을하는 일련의 jQuery 용 플러그인을 작성했습니다. 여기에서 볼 수 있습니다.>http://ben-major.co.uk/2011/11/jquery-mobile-events/.

현재 이들은 $(ele).tap(handler) 등으로 불려지지만, 사용자 지정 이벤트를 발생시키는 기능을 추가하고 싶습니다. 따라서 $(ele).on('tap', handler);과 같은 기능을 사용하여 기능을 활용할 수 있습니다.

것은 지금은 다음 코드를 사용하고 있지만이 작동하지 않습니다

$(function() { 
    $('*').tapstart(function() { $(this).trigger('tapstart'); }) 
      .tapend(function() { $(this).trigger('tapend'); }) 
      .tap(function() { $(this).trigger('tap'); }) 
      .doubletap(function() { $(this).trigger('doubletap'); }) 
      .taphold(function() { $(this).trigger('taphold'); }) 
      .swipedown(function() { $(this).trigger('swipedown'); }) 
      .swipeup(function() { $(this).trigger('swipeup'); }) 
      .swipeleft(function() { $(this).trigger('swipeleft'); }) 
      .swiperight(function() { $(this).trigger('swiperight'); }); 
}); 

여기 내 문제를 설명하는 jsFiddle입니다. 분명히 두 번째 div을 클릭하면 첫 번째 동작을 모방해야하지만 위에 제공된 바인딩이 파싱 된 후 DOM에 추가되었으므로 그렇지 않습니다.

내 질문에 : 내가 원하는 것을 달성하는 가장 좋은 방법은 무엇입니까? 현재 및 미래에 DOM에 존재하는 모든 요소를 ​​선택하는 방법이 있습니까 (가능한 경우 livequery 또는 외부 플러그인과 같은 것을 사용하지 않을 것입니다).

Answer 1

귀하의 경우에는 jQuery가 사용자 지정 이벤트를 제대로 처리하지 못한다고 생각합니다. (사용자 지정 이벤트가 문서 위로 버블 링되지 않았기 때문입니다). 대답은 이벤트 리스너의 한 부분을 document에 바인딩하는 것입니다. 이 상황에서 jQuery를 사용하지 마십시오.

jQuery의 라이브 모드는 내가 제안한 것과 거의 동일하지만 event.target을 바운드 선택기 (질문에서 '*'라고 말함)와 일치 시키려고 시도합니다.이 속도는 매우 느립니다 (배터리 드레인 또한

요소의 특정 유형 또는 특정 className과 상호 작용하려면 자기 자신이 처리하고 원하는 이벤트 처리기를 실행하십시오.

예 :

function findAncestorOfType(el, type) { 
    while (el && !(el instanceof type)) 
    el = el.parent; 
    return el; 
} 

document.addEventListener('click', function(evt) { 
    var target = findAncestorOfType(evt.target, LIElement); 
    if (target) { 
    // distinguish event type 
    type = 'click'; 
    callbacks[type](target, evt); 
    } 
}, false);