jQuery에서 이벤트 처리기에 인수를 전달할 수 있습니까? 같은 jQuery 코드와

Question

:

$("#myid").click(myfunction); 

function myfunction(arg1, arg2) {/* something */} 

어떻게 jQuery를 사용하는 동안 나는 myfunction에 인수를 전달합니까?

Answer 1

가장 간단한 방법은 ... 그래서 (당신이 함수에 전달 된 이벤트 정보를 사용하지 않는 가정)처럼 할

$("#myid").click(function() { 
    myfunction(arg1, arg2); 
}); 

jsFiddle입니다.

이렇게하면 click 이벤트가 트리거 될 때 호출되는 익명의 함수가 만들어집니다. 그러면 귀하가 제공하는 인수로 myfunction()으로 전화 할 것입니다.

ThisBinding (함수가 호출 될 때 this의 값을 유지하려면 해당 이벤트를 트리거 한 요소로 설정) call()으로 함수를 호출하십시오.

$("#myid").click(function() { 
    myfunction.call(this, arg1, arg2); 
}); 

jsFiddle.

예를 들어 설명한대로 직접 참조를 전달하거나 단일 인수가 jQuery event object이 될 수 없습니다. 당신이가 기준을 통과하고 싶은 경우

, 당신은 (Function.prototype.bind()에 대한 크로스 브라우저 래퍼) jQuery의 proxy() 기능을 활용해야합니다. 이렇게하면 앞에event 인수가 바인딩 된 인수를 전달할 수 있습니다.

$("#myid").click($.proxy(myfunction, null, arg1, arg2)); 

jsFiddle. 이 예에서

, myfunction()을 사용하여 실행 될 그 ThisBinding (위해) 인자 arg1 함께 arg2 (null 개체이므로 이벤트를 사용하는 트리거 소자의 정상 this 값이 아닌)을 그대로 마지막으로 jQuery event 오브젝트가 필요하지 않은 경우 무시할 수 있습니다 (함수의 인수에서 이름을 지정하지 마십시오).

(함수 인수 귀하의 질문에 언급처럼이 아닌)

또한 데이터를 전달하기 위해 jQuery를 event 객체의 data를 사용하여 사용할 수 있지만이 event.data.arg1를 통해 액세스 할 수 myfunction() 수정 필요, 또는 적어도 수동 도입 앞의 예제와 같은 프록시 함수 또는 후자의 예제를 사용한 생성 된 함수입니다.

Answer 2

확실히 Alex의 대답을 사용해야하는 반면 프로토 타입 라이브러리의 "bind"방법은 Ecmascript 5에서 표준화되었으며 곧 브라우저에서 기본적으로 구현됩니다. 그것은 다음과 같이 작동

jQuery("#myid").click(myfunction.bind(this, arg1, arg2)); 

Answer 3

$("#myid").on('click', {arg1: 'hello', arg2: 'bye'}, myfunction); 

function myfunction(e) { 

    var arg1 = e.data.arg1; 
    var arg2 = e.data.arg2; 

    alert(arg1); 
    alert(arg2); 

} 

//call method directly: 
myfunction({ 
    arg1: 'hello agian', 
    arg2: 'bye again' 
}); 

는 또한 바인딩과에 및 방법 떨어져 사용하여 특정 이벤트 핸들러 바인딩을 해제 할 수 있습니다.

예 :

$("#myid").off('click', myfunction); 

이 #myid

Answer 4

올드 스레드에서 myFunction이 핸들러 바인딩을 해제하지만, 검색 목적을위한 것입니다;

$(selector).on('mouseover',...); 

... 그리고 "데이터"매개 변수 체크 아웃 : 시도 http://api.jquery.com/on/

예 :

function greet(event) { 
    alert("Hello " + event.data.name); 
} 
$("button").on("click", {name: "Karl"}, greet); 
$("button").on("click", {name: "Addy"}, greet); 

Answer 5

간단한 :의

$(element).on("click", ["Jesikka"], myHandler); 

function myHandler(event){ 
    alert(event.data);  //passed in "event.data" 
}