jquery.ui.dialog.js是jQuery UI庫中的一款插件,它能夠創建一個彈出式的對話框(dialog),無論是對話框的內容還是風格,都可以通過參數進行自定義。
$( "#dialog" ).dialog({ autoOpen: false, // 是否自動打開對話框 modal: true, // 是否模態對話框 minWidth: 400, // 對話框最小寬度 resizable: false, // 是否可重新調整大小 closeOnEscape: true, // 按ESC鍵是否關閉對話框 buttons: { // 設置對話框按鈕 "確定": function() { $(this).dialog("close"); }, "取消": function() { $(this).dialog("close"); } } });
其中autoOpen指定彈出對話框是否需要手動手動調用open方法打開,modal表示是否需要模態對話框,minWidth表示對話框的最小寬度,resizable表示對話框是否允許重新調整大小,closeOnEscape表示是否按ESC鍵可以關閉對話框。
而buttons指定對話框中的按鈕,每個按鈕的名稱和回調函數都需要定義好。
$( "#dialog" ).dialog( "open" ); // 手動打開對話框 $( "#dialog" ).dialog( "close" ); // 關閉對話框 $( "#dialog" ).dialog( "option", "minWidth", 500 ); // 修改對話框最小寬度
通過以上方法可以手動打開和關閉對話框,同時也可以通過option方法修改對話框的參數。