2009-04-14 12 views
4

jQuery를 사용하여 click 이벤트를 일부 요소에 바인딩하려고합니다. 프로토 타입을 사용하면 BindAsEventListener()을 사용하여이 작업을 수행 할 수 있음을 알았습니다. 이름이 지정된 함수로 "처리기"를 정의하고자하는 경우 또는BindAsEventListener는 jQuery에서 이에 해당합니까?

$("#someElement").click(function(event) { 
    alert("Hi you clicked me!"); 
}); 

:

예 :

var myObject = { 

init: function(txtOneId, txtTwoId, lblResultId, ancAddId) { 
    this.txtOneId = txtOneId; 
    this.txtTwoId = txtTwoId; 
    this.lblResultId = lblResultId; 
    this.ancAddId = ancAddId; 


    var addListener = this.addResult.bindAsEventListener(this); 

    Event.observe(this.txtOneId, 'keyup', addListener); 
    Event.observe(this.txtTwoId, 'keyup', addListener); 
}, 

addResult: function() { 

    var valueOne = $(this.txtOneId).value; 
    var valueTwo = $(this.txtTwoId).value; 

    if (isNaN(valueOne) || valueOne == "") 
     valueOne = 0; 
    else 
     valueOne = parseInt(valueOne); 

    if (isNaN(valueTwo) || valueTwo == "") 
     valueTwo = 0; 
    else 
     valueTwo = parseInt(valueTwo); 


    var result = valueOne + valueTwo; 

    $(this.lblResultId).innerHTML = result; 

    return false; 
}}; 

답변

5

를 제출 있도록 $() 프로토 타입 방법과 $ j에있다()은 jQuery 메소드입니다.

빠른 답변

당신은 당신의 초기화 방법에 변화를 확인해야합니다. 이벤트가 수신 될 때이 참조 사용할 수 있도록

init: function(txtOneId, txtTwoId, lblResultId, ancAddId) { 
     this.txtOneId = txtOneId; 
     this.txtTwoId = txtTwoId; 
     this.lblResultId = lblResultId; 
     this.ancAddId = ancAddId; 

     var handler = function(event){ event.data.addResult(event) }; 

     $j(this.txtOneId).bind('keyup', this, handler); 
     $j(this.txtTwoId).bind('keyup', this, handler); 
    } 

설명

은 프로토 타입 사용하면 bindAsEventListener 기능을 사용했다. 당신이 (jquery api에서) 다음 구문을 사용하여 바인드 방법이 이벤트 데이터를 전달할 수 있습니다 jQuery를 들어

: 익명 함수를 사용하여,

.bind(eventType [, eventData], handler(eventObject)); 

이 코드에 적용,이에 해결합니다

우리는 텍스트 요소에 '의 keyup'이벤트를 바인딩이 경우
$j(this.txtOneId).bind('keyup', this, function(event){ event.data.addResult(event) }); 

상기 this.addResult을 실행 event.data으로 EVENTDATA (이) EVENTDATA와이 기준을 통과하고 핸들러 함수에서는 참조 (사건) 방법.

+0

아직 올바른 프로토 타입을 사용하고 있습니다 ... 죄송합니다. ... 당신도 NASA 계약자입니까? 시원한. –

0

click(fn)

function someElementClicked(event) { 
    alert("Hi you clicked me!"); 
}; 

$("#someElement").click(someElementClicked); 
-2

은 정확한 등가는 $입니다() .bind() 함수 :

(210)
$("#elem").bind('click', function() { 
    //do stuff here 
}); 
+0

아니 정확히 동일합니다. 이것을 위해 트래비스와 altCognitor의 대답을 선호합니다 – hcpl

2

Bind documentation.

당신은이 예제를 사용하는 것이 좋습니다 : 샘플에서는이 이벤트 처리기에서 개체를 사용합니다. 이 코드를 사용하면 개체를 바인딩하고 이벤트의 일부로 다시 가져올 수 있습니다. 클로저를 만드는 것보다 조금 더 편리합니다. 가능한 이벤트 값 :

function Something() { 
    this.myData = "fun"; 
    this.handleClick = function(event) { 
    alert(event.data.myData); 
    } 
} 

var something = new Something(); 
$('h2').bind("click", something, something.handleClick); 

바인딩은 거의 모든 당신이 필요로하는 이벤트와 동작 흐림, 초점,로드, 크기를 조정 스크롤, beforeunload 언로드, 클릭, dblclick, mousedown, mouseup에, MouseMove 이벤트, 마우스 오버, 마우스를 이동하면, mouseenter를, 하는 MouseLeave, 변경, 선택,를 keyDown, 키를 누를 때,의 keyup, 오류 난 당신이 아직 프로토 타입을 사용하고 있고 jQuery를에게 충돌을 첨가하지 않은 가정

3

jQuery를 사용하여 프로토 타입 기능을 활용할 수 있습니다.당신은 질문의 예제 코드에 필요한 여기에 이벤트 객체를 상실하기 때문에 프록시는

http://api.jquery.com/jQuery.proxy/

관련 문제