jQuery UI 訊息盒 (Msgbox) 語法

今天撰寫 jQuery UI 程式時一時忘了訊息盒用法, 整理如下備查. 網頁元件部份, 不論網頁中要顯示多少個不同的訊息, 只要用一個 DIV 元素即可 (共用) :

<div id="msgbox" title="訊息"></div>

在 jQuery 部分, 先呼叫 dialog 進行訊息框初始化, 其中選項務必將 autoOpen 設為 false, 否則網頁一開, 訊息盒就顯示了, 我們要等按鈕按下了再顯示 :

var opt={autoOpen: false,
               buttons: {"確定": function() {$(this).dialog("close");}}
               };
$("#msgbox").dialog(opt);

當按下按鈕或條件符合時, 先用 html() 設定訊息內容, 再用 dialog("open") 顯示訊息盒 :

$("#copy").click(function() {
  $("#msgbox").html("指令已複製到剪貼簿");
  $("#msgbox").dialog("open");
  });