jQuery是Javascript框架中的一種，十分常用。而jQuery UI則是jQuery框架中擴展了一些常用組件的庫集，其中最常用的組件之一就是dialog，即“對話框”組件。在使用dialog時，有同步和異步兩種方式。

首先來看同步方式：

$(function() {
$("#dialog").dialog({
autoOpen: false,
modal: true,
buttons: {
"確認": function() {
$(this).dialog("close");
},
"取消": function() {
$(this).dialog("close");
}
}
});
$("#button").click(function() {
$("#dialog").dialog("open");
console.log("這里是對話框打開后的代碼流");
});
console.log("這里是對話框打開前的代碼流");
});

在這個例子中，我們定義了一個id為“dialog”的div，表示對話框；一個id為“button”的button，表示打開對話框的按鈕。然后在$(function(){...})里面定義dialog的參數，最常用的就是autoOpen和buttons參數。autoOpen表示當頁面加載完畢后，是否自動打開對話框，本例中設置為false即不自動打開。而buttons則是定義對話框上的按鈕，本例中設置了“確認”和“取消”。

然后在button的click事件中，使用$("#dialog").dialog("open")來打開對話框。注意這里的代碼流先輸出“這里是對話框打開前的代碼流”，然后對話框打開后才輸出“這里是對話框打開后的代碼流”，即代碼是同步運行的。