前段時間碰到個問題 jquery UI dialog彈出層 彈出多個層是 比如彈出兩個層A和B B層如果顯示的數據表格太大，伸到了A層的外面，那伸到A層之外的部分就看不到了，因爲B層是在A層上彈出的 B的大小受到A層大小的限制
於是找到了這個資料 保存下來
-----------------------------------------------------------------------------------------------------
初始化參數
對於 dialog 來說，首先需要進行初始化，在調用 dialog 函數的時候，如果沒有傳遞參數，或者傳遞了一個對象，那麼就表示在初始化一個對話框。
沒有參數，表示按照默認的設置初始化對話框，在當前最新版本的 jQuery UI 1.8.9 中， dialog 支持下列屬性。
autoOpen 初始化之後，是否立即顯示對話框，默認爲 true
modal 是否模式對話框，默認爲 false
closeOnEscape 當用戶按 Esc 鍵之後，是否應該關閉對話框，默認爲 true
draggable 是否允許拖動，默認爲 true
resizable 是否可以調整對話框的大小，默認爲 true
title 對話框的標題，可以是 html 串，例如一個超級鏈接。
position 用來設置對話框的位置，有三種設置方法
1. 一個字符串，允許的值爲 'center', 'left', 'right', 'top', 'bottom'. 此屬性的默認值即爲 'center'，表示對話框居中。
2. 一個數組，包含兩個以像素爲單位的位置，例如，
position: [100, 100]
};
3. 一個字符串組成的數組，例如， ['right','top']，表示對話框將會位於窗口的右上角。
position: ["left", "bottom"]
};
一組關於尺寸的屬性，以像素爲單位。
width 寬度, 默認 300
height 高度，默認 'auto'
minWidth 最小寬度，默認 150
minHeight 最小高度，默認 150
maxWidth 最大寬度
maxHeight 最大高度
還有關於關閉的效果
hide 當對話框關閉時的效果，默認爲 null, 例如， hide: 'slide'
show 當對話框打開時的效果。默認爲 null
堆疊
stack 對話框是否疊在其他對話框之上。默認爲 true
zIndex 對話框的 z-index 值，一個整數，越大越在上面。默認 1000
按鈕
buttons 一個對象，屬性名將會被作爲按鈕的提示文字，屬性值爲一個函數，即按鈕的處理函數。
buttons: {
"Ok": function() { } ,
"Cancel": function() {}
}
}
$("#myDialog").dialog(dialogOpts);
IE6 的 select 元素穿透問題
bgiframe 解決 IE6 的 select 元素穿透問題，通過增加一個 iframe 來解決。默認爲 true
這一功能需要使用腳本 jquery.bgiframe-2.1.2，腳本在 jQuery UI 壓縮包中 development-bundle/external 文件夾中，需要將這個文件加入到頁面中。
<script src="../external/jquery.bgiframe-2.1.2.js"></script>
<script src="../ui/jquery.ui.core.js"></script>
這個控件現在有一個bug,在彈出窗口有遮罩層的情況下，在chrome下，如果出現縱向滾動條，無法用鼠標拖動，只能使用滾輪。
上邊的說明來自 王洋
設置前
設置後
示例
bgiframe: true,
resizable: false,
height:140,
modal: true,
overlay: {
backgroundColor: '#000',
opacity: 0.5
},
buttons: {
'Delete all items in recycle bin': function() {
$(this).dialog('close');
},
Cancel: function() {
$(this).dialog('close');
}
}
});
效果如下。
對話框的方法
初始化之後，就可以使用對話框了，比如說打開對話框，關閉對話框，這需要通過對話框的方法來完成。
對話框的方法需要通過調用 dialog 函數，並傳遞字符串形式的方法來完成。例如，dialog( "open" ) 表示調用對話框的 open 方法。
open 打開對話框，需要注意的是，並沒有 open() 方法，而是通過 dialog( "open" ) 來調用。例如， .dialog( "open" )
close 關閉對話框
destroy 摧毀一個對話框，去除對話框功能，將元素還原爲初始化之前的狀態。
isOpen 檢查對話框的狀態，如果已經打開，返回 true.
moveToTop 將對話框移到對話框的頂端
option 設置或者讀取對話框某個屬性的值，有兩種用法。
如果第二個參數爲字符串，如果提供了三個參數，表示設置，如果兩個參數，表示讀取。 例如 .dialog( "option" , optionName , [value] )
如果第二個參數爲對象，表示一次性設置多個屬性。
enable 啓用對話框
disable 禁用對話框
對話框的事件
在對話框使用過程中，還將觸發多種事件，我們可以自定義事件處理函數進行響應。
create
open
focus
dragStart
drag
dragStop
resizeStart
resize
resizeStop
beforeClose
close
例如，下面的設置了 open，close，beforeClose 的事件處理，顯示窗口的狀態。
open: function() {
$("#status").find(".ui-widget-content").text("The dialog is open");
},
close: function() {
$("#status").find(".ui-widget-content").text("The dialog is closed");
},
beforeclose: function() {
if (parseInt($(".ui-dialog").css("width")) == 300 ||
parseInt($(".ui-dialog").css("height")) == 300) {
return false
}
}
};
$("#myDialog").dialog(dialogOpts);
效果如下
對話框使用常見問題
常見的問題就是多次初始化一個對話框。
對話框僅僅需要初始化一次，多次初始化會有問題。
原文地址：http://blog.csdn.net/xue_feitian/article/details/6462105