lhgdialog
應(yīng)用到你的項目
在頁面head引入lhgdialog(如果項目采用jQuery作為框架，則引用jQuery的庫)。
<script type="text/javascript" src="lhgdialog.min.js"></script>配置全局默認(rèn)參數(shù)(可選):
(function(config){?config['extendDrag'] = true; // 注意，此配置參數(shù)只能在這里使用全局配置，在調(diào)用窗口的傳參數(shù)使用無效?config['lock'] = true;?config['fixed'] = true;?config['okVal'] = 'Ok';?config['cancelVal'] = 'Cancel';?// [more..]? })($.dialog.setting);?// 如果只設(shè)置一個或少量全局配置也可這樣：? $.dialog.setting.extendDrag = true;快速入門
一、使用傳統(tǒng)的參數(shù)
$.dialog(content,ok,cancel)
二、使用字面量傳參
$.dialog(options)
窗口lhgdialog.min.js文件的url參數(shù)
參數(shù)形式為：<script type="text/javascript" src="lhgdialog.min.js?self=true&skin=chrome"></script>
self：指定彈出窗口的頁面
類型：String? 默認(rèn)：'false'? 說明：此參數(shù)只用在框架頁面中，如果不寫此參數(shù)或值為false時則窗口跨框架彈出在框架最頂層頁面，如果值為true則不跨框架，而在當(dāng)前面頁彈出。skin：多皮膚共享CSS文件名
類型：String? 默認(rèn)：'default'? 說明：不寫此參數(shù)則值為default。如果你想在同一頁面使用不同皮膚的窗口，此處的值就為多皮膚共存的CSS的文件名url參數(shù)不需要設(shè)定的就可以不寫，不寫時就使用默認(rèn)值。
初始化參數(shù)列表
內(nèi)容相關(guān)
title：窗口的標(biāo)題文本
類型：String|Boolean? 默認(rèn)：'視窗'? 說明：窗口標(biāo)題的文件字符，如果值為false時就會隱藏標(biāo)題欄content：窗口中加載的內(nèi)容
類型：String? 默認(rèn)：'loading...'? 說明：1.如果想加載單獨的頁面，只要在字符前加'url:'字符即可，如：content:'url:content.html'?2.如果沒有設(shè)定content的值則會有loading的動畫按鈕相關(guān)
ok：確定按鈕回調(diào)函數(shù)
類型：Function|Boolean? 默認(rèn)：null? 說明：函數(shù)如果返回false將阻止對話框關(guān)閉；函數(shù)this指針指向內(nèi)部api；如果傳入true表示只顯示有關(guān)閉功能的按鈕cancel：取消按鈕回調(diào)函數(shù)
類型：Function|Boolean? 默認(rèn)：null? 說明：1.函數(shù)如果返回false將阻止對話框關(guān)閉；函數(shù)this指針指向內(nèi)部api；?2.如果傳入true表示只顯示有關(guān)閉功能的按鈕，標(biāo)題欄的關(guān)閉按鈕其實就是取消按鈕，點擊同樣觸發(fā)cancel事件?3.如果值為false時則隱藏標(biāo)題欄右邊的關(guān)閉按鈕okVal：確定按鈕文字
類型：String? 默認(rèn)：確定cancelVal：取消按鈕文字
類型：String? 默認(rèn)：取消min：是否顯示最小化按鈕
類型：Boolean? 默認(rèn)：truemax：是否顯示最大化按鈕
類型：Boolean? 默認(rèn)：truebutton：自定義按鈕
類型：Array? 默認(rèn)：null? 說明：? 配置參數(shù)成員：? name —— 按鈕名稱? callback —— 按下后執(zhí)行的函數(shù)? focus —— 是否聚焦點? disabled —— 是否標(biāo)記按鈕為不可用狀態(tài)（后續(xù)可使用擴展方法讓其恢復(fù)可用狀態(tài)）? 示例：? 參數(shù)如：[{name: '登錄', callback: function () {}}, {name: '取消'}] 。注意點擊按鈕默認(rèn)會觸發(fā)按鈕關(guān)閉動作，需要阻止觸發(fā)關(guān)閉請讓回調(diào)函數(shù)返回false尺寸相關(guān)
width：指定窗口的寬度
類型：Number|String? 默認(rèn)：'auto'? 說明：1. 設(shè)置窗口的寬度，可以帶單位。一般不需要設(shè)置此，對話框框架會自己適應(yīng)內(nèi)容?2.如果設(shè)置為百分值單位，將會以根據(jù)瀏覽器可視范圍作為基準(zhǔn)，此時如果瀏覽器窗口大小被改變其也會進行相應(yīng)的調(diào)整height：指定窗口的高度
類型：Number|String? 默認(rèn)：'auto'? 說明：1.設(shè)置窗口的高度，可以帶單位。?2.如果設(shè)置為百分值單位，將會以根據(jù)瀏覽器可視范圍作為基準(zhǔn)，此時如果瀏覽器窗口大小被改變其也會進行相應(yīng)的調(diào)整minWidth：最小寬度限制
類型：Number? 默認(rèn)：96? 說明：此參數(shù)值只能為數(shù)字minHeight：最小高度限制
類型：Number? 默認(rèn)：32? 說明：此參數(shù)值只能為數(shù)字位置相關(guān)
fixed：開啟靜止定位
類型：Boolean? 默認(rèn)：false? 說明：靜止定位是css2.1的一個屬性，它靜止在瀏覽器某個地方不動，也不受滾動條拖動影響left：相對于可視區(qū)域的X軸的坐標(biāo)
類型：Number|String? 默認(rèn)：'50%'? 說明：可以使用'0%' ~ '100%'作為相對坐標(biāo)，如果瀏覽器窗口大小被改變其也會進行相應(yīng)的調(diào)整top：相對于可視區(qū)域的Y軸的坐標(biāo)
類型：Number|String? 默認(rèn)：'50%'? 說明：可以使用'0%' ~ '100%'作為相對坐標(biāo)，如果瀏覽器窗口大小被改變其也會進行相應(yīng)的調(diào)整視覺相關(guān)
lock：開啟鎖屏
類型：Boolean? 默認(rèn)：false? 說明：中斷用戶對話框之外的交互，用于顯示非常重要的操作/消息，所以不建議頻繁使用它，它會讓操作變得繁瑣background：鎖屏遮罩顏色
類型：String? 默認(rèn)：'#FFF'? 說明：請注意這是一個會影響到全局的配置，后續(xù)出現(xiàn)的對話框的遮罩顏色都和此設(shè)置一樣，再設(shè)置不再起作用opacity：鎖屏遮罩透明度
類型：Number? 默認(rèn)：.5? 說明：請注意這是一個會影響到全局的配置，后續(xù)出現(xiàn)的對話框的遮罩透明度都和此設(shè)置一樣，再設(shè)置不再起作用icon：定義消息圖標(biāo)
類型：String? 默認(rèn)：null? 說明：可定義“skins/icons/”目錄下的圖標(biāo)名作為參數(shù)名（一定要包含后綴名）titleIcon：標(biāo)題欄左邊的小圖標(biāo)
類型：String? 默認(rèn)：null? 說明：可定義“skins/icons/”目錄下的圖標(biāo)名作為參數(shù)名（一定要包含后綴名）padding：內(nèi)容與邊界填充邊距(即css padding)
類型：String? 默認(rèn)：'15px 10px'? 說明：如果內(nèi)容頁為iframe方式加載的則在css里需要設(shè)置為0，要不在IE6中易出問題skin：多皮膚共存時指定的皮膚樣式
類型：String? 默認(rèn)：''? 說明：指定窗口要使用的皮膚的主類名交互相關(guān)
time：設(shè)置對話框顯示時間
類型：Number? 默認(rèn)：null? 說明：以秒為單位resize：是否允許用戶調(diào)節(jié)尺寸
類型：Boolean? 默認(rèn)：truedrag：是否允許用戶拖動位置
類型：Boolean? 默認(rèn)：trueesc：是否允許用戶按Esc鍵關(guān)閉對話框
類型：Boolean? 默認(rèn)：true? 說明：只有窗口獲得焦點后才能使用此功能cache：是否緩存iframe方式加載的窗口內(nèi)容頁
類型：Boolean? 默認(rèn)：true? 說明：只有使用iframe方式加載的單獨頁面的內(nèi)容時此參數(shù)才有效extendDrag：是否開啟增強拖拽體驗
類型：Boolean? 默認(rèn)：true? 說明：1.此屬性為全局性設(shè)置，不能在窗口調(diào)用的參數(shù)里設(shè)置，只能使用lhgdialog.setting.extendDrag來設(shè)置?2.防止鼠標(biāo)落入iframe導(dǎo)致不流暢，對超大對話框拖動優(yōu)化高級相關(guān)
id：設(shè)定對話框唯一標(biāo)識
類型：String|Number? 默認(rèn)：null? 說明：1.防止重復(fù)彈出?2.定義id后可以使用this.get(youID)和lhgdialog.list[youID]獲取擴展方法zIndex：重置全局zIndex初始值
類型：Number? 默認(rèn)：1976? 說明：用來改變對話框疊加高度，請注意這是一個會影響到全局的配置，后續(xù)出現(xiàn)的對話框疊加高度將重新按此累加。init：對話框彈出后執(zhí)行的函數(shù)
類型：Function? 默認(rèn)：null? 說明：如果是以iframe方式加載的內(nèi)容頁此函數(shù)會在內(nèi)容頁加載完成后執(zhí)行close：對話框關(guān)閉前執(zhí)行的函數(shù)
類型：Function? 默認(rèn)：null? 說明：函數(shù)如果返回false將阻止對話框關(guān)閉。請注意這不是關(guān)閉按鈕的回調(diào)函數(shù)，無論何種方式關(guān)閉對話框，close都將執(zhí)行。parent：打開子窗口的父窗口對象
類型：Object? 默認(rèn)：null? 說明：此參數(shù)只用在打開多層窗口都使用遮罩層時才會用到此參數(shù)，注意多層窗口鎖屏?xí)r一定要加此參數(shù)擴展方法
窗口實例對象內(nèi)部方法
close()：關(guān)閉對話框
參數(shù)：無? 說明：在需要關(guān)閉窗口時可調(diào)用此方法reload(win,url)：刷新或跳轉(zhuǎn)指定的頁面
參數(shù)1：指定的要刷新或跳轉(zhuǎn)的頁面的window對象? 參數(shù)2：要跳轉(zhuǎn)到的頁面地址show()：顯示對話框
參數(shù)：無hide()：隱藏對話框
參數(shù)：無title(value)：寫入標(biāo)題
參數(shù)1：標(biāo)題的文本? 說明：無參數(shù)則返回創(chuàng)建的窗口對象實例content(value)：向窗口中寫入內(nèi)容
參數(shù)1：窗口中的內(nèi)容? 說明：如果參數(shù)的前3個字符為'url:'參使用iframe方式加載單獨的內(nèi)容頁，無參數(shù)則返回創(chuàng)建的窗口對象實例button(arguments)：插入一個自定義按鈕
參數(shù)1：name -- 按鈕名稱? 參數(shù)2：callback -- 按下后執(zhí)行的函數(shù)? 參數(shù)3：focus -- 是否聚焦點? 參數(shù)4：disabled -- 是否標(biāo)記按鈕為不可用狀態(tài)（后續(xù)可使用擴展方法讓其恢復(fù)可用狀態(tài)）? 說明：此參數(shù)為多個對象? 示例：? button({?name: '登錄',?focus: true,?callback: function(){}? },{?name: '取消'? });position(left,top)：重新定位對話框
參數(shù)1：X軸的坐標(biāo)? 參數(shù)2：Y軸的坐標(biāo)? 說明：參數(shù)可以為數(shù)字或帶單位的字符如：'200px'或使用'0%' ~ '100%'作為相對坐標(biāo)size(width,height)：重新設(shè)定對話框大小
參數(shù)1：窗口的寬度? 參數(shù)2：窗口的高度? 說明：參數(shù)可以為數(shù)字或帶單位的字符如：'200px'或使用'0%' ~ '100%'百分值單位max()：最大化窗口
參數(shù)：無min()：最小化窗口
參數(shù)：無lock()：鎖屏
參數(shù)：無unlock()：解鎖
參數(shù)：無time(val,callback)：定時關(guān)閉（單位秒）
參數(shù)1：數(shù)值，以秒為單位? 參數(shù)2：回調(diào)函數(shù)? 說明：參數(shù)2為窗口關(guān)閉前執(zhí)行的函數(shù)focus() ：自動設(shè)置窗口中焦點元素
參數(shù)：無zindex() ：置頂窗口
參數(shù)：無get(id,object) ：根據(jù)指定id獲取相應(yīng)的對象
參數(shù)1：窗口的id? 參數(shù)2：是否返回的是窗口實例對象? 說明：參數(shù)2的值只有為數(shù)字1時才返回指定id的窗口的實例對象api：內(nèi)容頁中調(diào)用窗口實例對象接口
說明：此對象屬性是附加在iframe元素的一個屬性，在iframe方式加載的內(nèi)容頁中通過調(diào)用此函數(shù)來獲取窗口的實例對象，示例：var api = frameElement.api; 注：此句代碼是加在iframe方式加載的內(nèi)容頁中的，一定要注意opener：加載窗口組件頁面的window對象
說明：此屬性主要用在iframe方式加載的內(nèi)容頁中，示例：var api = frameElement.api, W = api.opener; 此時的W即為加載窗口組件頁面的window對象iframe：iframe方式加載內(nèi)容的iframe對象
說明：此屬性主要用于在窗口組件調(diào)用頁面操作窗口中的iframe對象iwin：iframe方式加載內(nèi)容頁的window對象
說明：此屬性主要用于在窗口組件調(diào)用頁面操作窗口中的window對象，示例：var dg = $.dialog({'url:content.html',init:function(){ if( this.iwin.document.body ) alert('窗口內(nèi)容頁加載完成'); });窗口外部方法
$.dialog.focus：獲取焦點的窗口實例對象
說明：可以使用此屬性獲取兒得焦點的窗口的對象，示例：var dg = $.dialog.focus; 此時的dg就是當(dāng)前焦點窗口的對象實例$.dialog.list：所有窗口對象實例的集合
說明：通過此屬性可獲取所有打開的窗口對象，示例：關(guān)閉頁面所有對話框? var list = $.dialog.list;? for( var i in list ){?list[i].close();? }$.dialog.top：獲取lhgdialog可用最高層window對象
說明：這與直接使用window.top不同，它能排除url參數(shù)self為true時定義的頂層頁面為調(diào)用窗口組件頁面或者頂層頁面為框架集的情況$.dialog.data(name,value)：跨框架數(shù)據(jù)共享寫入接口
參數(shù)1：存儲的數(shù)據(jù)名? 參數(shù)2：將要存儲的任意數(shù)據(jù)(無此項則返回被查詢的數(shù)據(jù)，如果此值為false就刪除指定名稱的數(shù)據(jù))? 說明：框架與框架之間以及與主頁面之間進行數(shù)據(jù)交換是非常頭疼的事情，常規(guī)情況下你必須知道框架的名稱才能進行數(shù)據(jù)交換，如果是在復(fù)雜的多層框架下操作簡直就是噩夢。? 而data方法就是為了解決這個問題，你完全不用管框架層級問題，它可以寫入任何類型的數(shù)據(jù)，而做到各個頁面之間數(shù)據(jù)共享。擴展的一些提示性的窗口
$.dialog.alert(content,callback)：警告消息
參數(shù)1：內(nèi)容? 參數(shù)2：窗口關(guān)閉時執(zhí)行的回調(diào)函數(shù)$.dialog.confirm(content,yes,no)：確認(rèn)
參數(shù)1：內(nèi)容? 參數(shù)2：確定按鈕回調(diào)函數(shù)? 參數(shù)3：取消按鈕回調(diào)函數(shù)$.dialog.prompt(content,yes,value)：提問
參數(shù)1：內(nèi)容? 參數(shù)2：確定按鈕回調(diào)函數(shù)? 參數(shù)3：文本框默認(rèn)值$.dialog.tips(content,time,icon,callback)：短暫提示
參數(shù)1：內(nèi)容? 參數(shù)2：顯示時間? 參數(shù)3：提示圖標(biāo)? 參數(shù)4：提示關(guān)閉時執(zhí)行的函數(shù)$.dialog.load(url,options,cache)：Ajax填充內(nèi)容
參數(shù)1：地址? 參數(shù)2：配置參數(shù)? 參數(shù)3：是否允許緩存. 默認(rèn)false總結(jié)
- 上一篇： scp 安全复制（远程文件复制工具）
- 下一篇： 融资租赁业务的基本知识