2012-08-02 2 views
1

기본 대화 상자를 쓰려고합니다. 나는 클릭 할 때 대화 상자를 시작할 링크 요소를 지정할 수 있기를 원합니다.사용자 지정 이벤트 트리거 및 바인딩?

I'n 데이터를 사용하여이 동작을 지정하는 대화 상자 HTML 속성 :

<a id="launch-dialog" href="#"></a> 
<div class="dialog" data-behavior="dialog" data-trigger="#launch-dialog"> 
    <!-- dialog html --> 
</div> 

$(function(){ 
    $("[data-behavior='dialog']").dialog(); 
}); 

실제 jQuery를 확장 그래도 난에 문제가있어 일부입니다. 'dopen' 이벤트가 본문에서 올바르게 트리거되지 않았거나 이벤트 바인딩이 올바르게 설정되지 않았습니다. data-trigger의 클릭 이벤트는 확실히 발사되고 있습니다. 내가 "열린 감지 된"로그를 보지 못하는 이유는 무엇입니까?

(function($) { 
    var methods = { 
    init: function(options) { 

     if (this.data('trigger')) { 
     // Add an event listener which causes the dialog to 
     // open when the correct link is clicked. 
     $(this.data('trigger')).on('click', function(e) { 
      e.preventDefault(); 
      // Trigger a global dialog open event which the dialog can subscribe to. 
      $('body').trigger('dopen'); 
     }); 
     } 
    }, 
    // Various other methods not shown. 
    }; 

    $.fn.dialog = function(method) { 

    // Method handling code not shown... 

    // Add handlers for custom events triggered on the body element. 
    $('body').bind('dopen', function(e) { 
     // This never happns: 
     console.log("Open detected"); 
    }); 

    }; 
})(jQuery); 

답변

0

나는 실수로 문제를 해결할 수있는 충분한 정보를 내 질문에 제공하지 않았습니다. 내가 질문 코드

# Method handling code not shown... 

는 실제 코드가 다음

// If it corresponds to a method defined in the method object. 
if (methods[method]) { 
    return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 
// Else, if we pass in an object and 
} else if (_.isObject(method) || !method) { 
    return methods.init.apply(this, arguments); 
} else { 
    $.error('Method ' + method + ' does not exist on jQuery.doalog'); 
} 

당신이 볼 수 있듯이, 그 조각 세 가지 경로가 있습니다

  1. 메서드 호출 결과 반환
  2. 결과를 반환합니다. 메서드 호출,
  3. 예외가 발생합니다.

제어 흐름이이 경로에서 지름길로 바뀌고 있고 수신기를 바인딩하려는 줄에 도달하지 못했습니다. 물론 언 바운드 청취자는 결코 해고 될 수 없습니다.

var methods = { 
    init: function(options) { 

     // Add handlers for custom events triggered on the body element. 
     $('body').bind('dopen', function(e) { 
     // Now it works! 
     console.log("Open detected"); 
     }); 

     if (this.data('trigger')) { 
     // Add an event listener which causes the dialog to 
     // open when the correct link is clicked. 
     $(this.data('trigger')).on('click', function(e) { 
      e.preventDefault(); 
      // Trigger a global dialog open event which the dialog can subscribe to. 
      $('body').trigger('dopen'); 
     }); 
     } 
    }, 
    // Various other methods not shown. 
    } 
:

해결책은 초기화 방법들로 결합 움직였다

관련 문제