2011-09-29 156 views
0

單擊我網站上的按鈕打開一個模式對話框(顯示單詞「Saving」)並啓動一個Ajax命令。當命令完成後,我想更改對話框中的文本(「保存!」),等待500毫秒,並使對話框淡出。延遲淡出隱藏jQuery對話框

打開和修改對話框的內容是沒有問題的。儘管在延遲之後淡入對話框,但我遇到了麻煩。下面是該對話框的代碼:

$("#save_filters_dialog").dialog({ 
    autoOpen:false, 
    draggable:false, 
    resizable:false, 
    modal:true, 
    height:54, 
    width:70, 
    hide:"fade", 
    create: function(event,ui){ 
     $(this).siblings(".ui-dialog-titlebar").hide(); 
    } 
}); 

我還創建了這個代碼來測試關閉對話框(不使用一個Ajax命令):

$("#save_filters_dialog").click(function(){ 
    $(this).dialog("close"); 
}); 

淡出和關閉工作正常。我似乎無法找到將.delay(500)放在哪個位置以延遲淡出時間。

回答

1

使用setTimeout和一個匿名函數來包裝你想後做什麼:

setTimeout(function(){ console.log('Executed after 500ms'); }, 500); 
+0

工作很好!謝謝! –

1

你可以使用setTimeout()函數。

$("#save_filters_dialog").click(function(){ 
    setTimeout('closeDialog('+this+')',500); 
}); 

function closeDialog(object){ 
    $(object).dialog("close"); 
} 
+0

你不應該鼓勵在不需要時使用setTimeout中的字符串。 – sg3s

+0

對於setTimeout()建議+1。謝謝! –

5

這就是我閉上我的對話消息:

$("#save_filters_dialog").dialog(
{ 
autoOpen:false, 
draggable:false, 
resizable:false, 
modal:true, 
height:54, 
width:70, 
hide: {effect: "fadeOut", duration: 1000} 
}, setTimeout(function(){$("#save_filters_dialog").dialog("close");},2000));