2011-10-31 2 views
7

개봉 후 대화 상자를 자동으로 닫으려고합니다. 여기jQuery UI 대화 상자 setTimeout을 사용하여 자동 닫기

setTimeout($("#mydialog").dialog('close'), 3000); 

를이 맥락에서이다 : 나는 다음과 같은 방법을 시도했습니다

$("#acknowledged-dialog").dialog({ 
    height: 140, 
    modal: true 
}); 

setTimeout($("#acknowledged-dialog").dialog('close'), 3000); 

을하지만이 방법으로, 심지어는 표시되지 않습니다! 가까운 방법이 페이지에 표시되면 바로 호출되는 것 같아요. 로그에는 오류가 표시되지 않습니다.

나는 또한 dialogopen 이벤트에 바인딩을 시도했다 :

$("#acknowledged-dialog").bind('dialogopen', function(event, ui) { 
    setTimeout($(this).dialog('close'), 3000); 
}); 
$("#acknowledged-dialog").dialog({ 
    height: 140, 
    modal: true 
}); 

대화 쇼를하지만, 자동으로 닫히지 않습니다. 여기에 로그에 오류가 없습니다.

setTimeout에서 $에 대한 인수에 'this'를 사용할 수 없습니까?

답변

13

setTimeout은 3 초 후에 $ ("# mydialog"). dialog ("close")의 반환 값을 호출합니다. 모든 것을 문자열로 던지려면 잘 작동해야합니다. 또한 대화 상자를 초기화하기 전에 'dialogopen'을 바인딩 할 필요가 없다고 생각합니다. 아래는 잘 작동합니다 :

$("#acknowledged-dialog").dialog({ 
    height: 140, 
    modal: true, 
    open: function(event, ui){ 
    setTimeout("$('#acknowledged-dialog').dialog('close')",3000); 
    } 
}); 
+0

그리고 아니오, 당신이 @toby를 따라 함수를 감싸지 않는다면 위의 코드에서 setTimeout에 'this'를 사용할 수 없다는 것을 발견했습니다. – DefyGravity

+1

Chrome 확장 프로그램을 만들 때와 같이 문자열 평가가 작동하지 않는 상황에서 문자열을 익명 함수로 바꿀 수 있습니다. –

+0

사용자가 제한 시간 전에 대화 상자를 수동으로 닫으면 위 코드의 타이머가 계속 실행되고 두 번째 대화 상자를 닫으려고 시도합니다. 대화 상자가 소멸되지 않으면 확인됩니다. 그러나 대화 상자가 첫 번째 시간 초과 전에 두 번째로 표시되면 첫 번째 타이머가 대화 상자를 일찍 닫습니다. –

8

발생하는 문제에 대해 article을 작성했습니다. 읽어주세요.

즉, $("#mydialog").dialog('close')을 지연 또는 트리거 된 이벤트의 결과로 실행하려는 모든 위치에서 인라인 함수로 래핑하려고합니다.

setTimeout(function(){ 
    $("#mydialog").dialog('close') 
}, 3000); 

대화 상자는 각 경우마다 열 때마다 닫히기 때문에 표시되지 않습니다.

+0

DefyGravity가 지적했기 때문에 콜백 내에서 'this'를 참조 할 수 없습니다. – airportyh

+1

나중에 참조 할 수 있도록 변수에 저장된'this'를 사용할 수 있습니다. 이 기능은 ID가 반드시 필요하지 않은 동적 대화 상자가있을 때 편리하게 작동합니다. 단순히'this'를'open' 콜백 안에'setTimeout' 전에 저장하고 클로저와 같은 변수를 사용하기 만하면됩니다. 이렇게하면 휴대하기가 더 쉽습니다. 'open : function (event, ui) {var $ this = $ (this); setTimeout (function() {$ this.dialog ('close')}, 3000); }' – Demonslay335

관련 문제