資源描述：
《jqueryui庫中dialog對(duì)話框功能使用全解析_jquery》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在工程資料-天天文庫。
1、jQueryUI庫中dialog對(duì)話框功能使用全解析對(duì)話框(dialog),是jQueryUI非常重要的一個(gè)功能。它徹底的代替了JavaScript的alert()>prompt()等方法，也避免了新窗口或頁面的繁雜冗余。一.開啟多個(gè)dialog只要設(shè)置不同的id即可實(shí)現(xiàn)。$('#x').dialog();$('#y').dialog();二.修改dialog樣式在彈；1【的dialog對(duì)話框中，在火狐瀏覽器中打開Firebug或者右擊-〉查看元素?？梢钥纯磀ialog的樣式，對(duì)dialog的標(biāo)題背景進(jìn)彳亍修改。//無須修改ui里的CS
2、S,直接用style,css替代掉.ui-widget-header{background:url(??/img/xxx?png);三.dialog0方法的屬性對(duì)話框方法有兩種形式：1.dialog(options),options是以對(duì)象鍵值對(duì)的形式傳參，每個(gè)鍵值對(duì)表示一個(gè)選項(xiàng);2.dialog('action',param),action是操作對(duì)話框方法的字符串，param則是options的某個(gè)選項(xiàng)。dialog外觀選項(xiàng)屬性默認(rèn)值/類型說明title無/字符串對(duì)話框的標(biāo)題，可以直接設(shè)置在DOM元索上buttons無/對(duì)象以對(duì)彖鍵值
3、對(duì)方式，給dialog添加按鈕。鍵是按鈕的名稱，值是用戶點(diǎn)擊后調(diào)用的回調(diào)函數(shù)$C#reg‘).dialog({title:'注冊(cè)’，buttons:{'按鈕’：function(){});dialog頁面位置選項(xiàng)屬性默認(rèn)值/類型說明positioncenter/字符串設(shè)迸一個(gè)對(duì)話框窗口的坐標(biāo)位迸，默認(rèn)為center?其他設(shè)置值為:lefttopstopright>bottomleft^rightbottom（四個(gè)角）、top>bottom（頂部或底部，寬度居中）、left或血ht（左邊或右邊，高度居中）、center（默認(rèn)值）$('#r
4、eg').dialog({position:'lefttop'});dialog大小選項(xiàng)屬性默認(rèn)值/類型說明width300/數(shù)值對(duì)話框的寬度。默認(rèn)為300,單位是像素。heightauto/數(shù)值對(duì)話框的高度。默認(rèn)為auto,單位是像素。minWidth150/數(shù)值對(duì)話框的最小寬度。默認(rèn)150,單位是像素。minHeight150/數(shù)值對(duì)話框的最小高度。默認(rèn)150,單位是像素。maxWidthmuto/數(shù)值對(duì)話框的最大寬度。默認(rèn)auto,單位是像素。maxHeightauto/數(shù)值對(duì)話框的最大高度。默認(rèn)auto,單位是像索。$C#reg
5、").dialog({height:500,width:500,minWidth:300,minHeight:300,maxWidth:800,maxHeight:600});dialog視覺選項(xiàng)屬性默認(rèn)值/類型說明showfalse/布爾值顯示對(duì)話框時(shí)，默認(rèn)采用淡入效果。hidefalse布爾值關(guān)閉対話框時(shí)，默認(rèn)采用淡岀效果。$Cttreg").dialog({show:true,hide:true});注意：設(shè)置true后，默認(rèn)為淡入淡出，如果想使用別的特效，可以使用以下表格中的字符串參數(shù)。show和hide可選特效特效名稱說明bl
6、ind對(duì)話框從頂部顯示或消失bounce對(duì)話框斷斷續(xù)續(xù)地顯示或消失，垂直運(yùn)動(dòng)clip對(duì)話框從中心垂直地顯示或消失slide對(duì)話框從左邊顯示或消失drop對(duì)話框從左邊顯示或消失，有透明度變化fold對(duì)話框從左上角顯示或消失highlight對(duì)話框顯示或消失，伴隨著透明度和背景色的變化puff對(duì)話框從屮心開始縮放。顯示時(shí)''收縮〃，消失時(shí)''生長(zhǎng)〃scale對(duì)話框從中心開始縮放。顯示吋'、生長(zhǎng)〃，消失時(shí)''收縮〃pulsate對(duì)話框以閃爍形式顯示或消失$('#reg').dialog({show:'blind',hide:，blind'})
7、；dialog行為選項(xiàng)屬性J默認(rèn)值/類型說明autoOpentrue/布爾值默認(rèn)為true,調(diào)用dialog()方法時(shí)就會(huì)打開對(duì)話框；如果為false,對(duì)話框不可見,但對(duì)話框已創(chuàng)建,可以通過dialog('open')才能可見。draggabletrue/布爾值默認(rèn)為true,口J以移動(dòng)對(duì)話框，false無法移動(dòng)。resizabletrue/布爾值默認(rèn)為true,可以調(diào)整對(duì)話框大小，false無法調(diào)整modalfalse/布爾值默認(rèn)為false,對(duì)話框外可操作，true對(duì)話框會(huì)遮罩一層灰紗，無法操作。closeText無/字符串設(shè)置關(guān)閉
8、按鈕的title文字$('#reg').dialog({autoOpen:false,draggable:false,resizable:false,modal:true,closeText:關(guān)閉'});一
