2013-08-29 2 views
2

간단한 버튼이 있습니다. 클릭하면 처리기로 데이터를 보내야합니다. 나는이 샘플 만든런타임 매개 변수 값을 jQuery의 ON 메소드에 보냅니 까?

.on(events [, data ], handler(eventObject)) 

:

var aaa="john"; 

function greet(event) { alert("Hello "+event.data.name); } 

$("button").on("click", { name: aaa}, greet); 

setTimeout(function(){aaa="paul"},2000) 

그러나 2 초 대기 후를, 난 아직도 참조 : 그래서 "Hello John"

그래서

나는 ON overload method를 사용하여이 코드를 나는 해석 시간에 aaa 값이 한정되어 있다고 가정합니다.

질문 :

2 초 후 다시는 경고를 수 있도록

가 어떻게 코드를 변경할 수 있습니다 : Hello Paul?

JSBIN

답변

4

간단한 방법은 객체 리터럴 사용하는 것이다. 당신은 이벤트 데이터로 전달하고 나중에 수정 참조 유지할 수 있습니다 :

var greetData = { 
    name: "john" 
}; 

function greet(event) 
{ 
    alert("Hello " + event.data.name); 
} 

$("button").on("click", greetData, greet); 

setTimeout(function() { 
    greetData.name = "paul"; 
}, 2000); 

당신은 업데이트 된 JS 빈 here를 찾을 수 있습니다.

+0

값을 유지하기 위해 전역 개체를 만드는 것을 싫어합니다. :-( –

+0

질문에서 동일한 패턴을 코드로 사용했지만 개체가 전역 일 필요는 없습니다. 그것을 통해 함수를 노출 시키거나 간단히'data()'를 사용하여 DOM 요소와 연관시킨다. –

3

Frédéric Hamidi's answer이 더 좋습니다. 이것을 대안으로 남겨 둘 것입니다. 당신은 이름 그 자체 대신 이름을로드하는 기능을 전달할 수 있도록 당신이 그것을 변경하는 경우

이 작동합니다

var aaa="john"; 

function getName() { 
    return aaa; 
} 

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

setTimeout(function(){aaa="paul";},2000); 

http://jsbin.com/ohAJihi/4/edit

0

은 이해하기가 조금 혼란 당신이 무엇을 달성하려고합니다. setTimeout을 사용하는 경우; theres는 버튼 onclick 처리기를 사용할 필요가 없습니다. 둘째, setTimeout 함수의 범위는 항상 창 개체입니다. 따라서 객체의 값에 액세스해야하는 경우에는 객체에 대한 참조를 만들고 setTimeout 함수에서 사용하십시오.

+0

setTimeout은 단지 지연을 시뮬레이트하기위한 것이고, window 객체 관련 정보에 대한 setTimeout은'this' 값 . (내 질문과는 아주 무관 함) –

관련 문제