jeecg的$.dialog的一些參數


 

 

jeecg表單彈出框采用的技術是lhgdialog

一、配置全局默認參數

復制代碼
(function(config){
    config['extendDrag'] = true; // 注意,此配置參數只能在這里使用全局配置,在調用窗口的傳參數使用無效
    config['lock'] = true;
    config['fixed'] = true;
    config['okVal'] = 'Ok';
    config['cancelVal'] = 'Cancel';
    // [more..]
})($.dialog.setting);

// 如果只設置一個或少量全局配置也可這樣:
$.dialog.setting.extendDrag = true;
復制代碼

二、參數說明(http://www.lhgdialog.com/api/

內容相關

  1. title:窗口的標題文本

    類型:String|Boolean
    默認:'視窗'
    說明:窗口標題的文件字符,如果值為false時就會隱藏標題欄
  2. content:窗口中加載的內容

    類型:String
    默認:'loading...'
    說明:1.如果想加載單獨的頁面,只要在字符前加'url:'字符即可,如:content:'url:content.html'
         2.如果沒有設定content的值則會有loading的動畫

按鈕相關

  1. ok:確定按鈕回調函數

    類型:Function|Boolean
    默認:null
    說明:函數如果返回false將阻止對話框關閉;函數this指針指向內部api;如果傳入true表示只顯示有關閉功能的按鈕
  2. cancel:取消按鈕回調函數

    類型:Function|Boolean
    默認:null
    說明:1.函數如果返回false將阻止對話框關閉;函數this指針指向內部api
         2.如果傳入true表示只顯示有關閉功能的按鈕,標題欄的關閉按鈕其實就是取消按鈕,點擊同樣觸發cancel事件
         3.如果值為false時則隱藏標題欄右邊的關閉按鈕
  3. okVal:確定按鈕文字

    類型:String
    默認:確定
  4. cancelVal:取消按鈕文字

    類型:String
    默認:取消
  5. min:是否顯示最小化按鈕

    類型:Boolean
    默認:true
  6. max:是否顯示最大化按鈕

    類型:Boolean
    默認:true
  7. button:自定義按鈕

    類型:Array
    默認:null
    說明:
    配置參數成員:
    name —— 按鈕名稱
    callback —— 按下后執行的函數
    focus —— 是否聚焦點
    disabled —— 是否標記按鈕為不可用狀態(后續可使用擴展方法讓其恢復可用狀態)
    示例:
    參數如:[{name: '登錄', callback: function () {}}, {name: '取消'}] 。注意點擊按鈕默認會觸發按鈕關閉動作,需要阻止觸發關閉請讓回調函數返回false

尺寸相關

  1. width:指定窗口的寬度

    類型:Number|String
    默認:'auto'
    說明:1. 設置窗口的寬度,可以帶單位。一般不需要設置此,對話框框架會自己適應內容
         2.如果設置為百分值單位,將會以根據瀏覽器可視范圍作為基准,此時如果瀏覽器窗口大小被改變其也會進行相應的調整
  2. height:指定窗口的高度

    類型:Number|String
    默認:'auto'
    說明:1.設置窗口的高度,可以帶單位。
         2.如果設置為百分值單位,將會以根據瀏覽器可視范圍作為基准,此時如果瀏覽器窗口大小被改變其也會進行相應的調整
  3. minWidth:最小寬度限制

    類型:Number
    默認:96
    說明:此參數值只能為數字
  4. minHeight:最小高度限制

    類型:Number
    默認:32
    說明:此參數值只能為數字

位置相關

  1. fixed:開啟靜止定位

    類型:Boolean
    默認:false
    說明:靜止定位是css2.1的一個屬性,它靜止在瀏覽器某個地方不動,也不受滾動條拖動影響
  2. left:相對於可視區域的X軸的坐標

    類型:Number|String
    默認:'50%'
    說明:可以使用'0%' ~ '100%'作為相對坐標,如果瀏覽器窗口大小被改變其也會進行相應的調整
  3. top:相對於可視區域的Y軸的坐標

    類型:Number|String
    默認:'50%'
    說明:可以使用'0%' ~ '100%'作為相對坐標,如果瀏覽器窗口大小被改變其也會進行相應的調整

視覺相關

  1. lock:開啟鎖屏

    類型:Boolean
    默認:false
    說明:中斷用戶對話框之外的交互,用於顯示非常重要的操作/消息,所以不建議頻繁使用它,它會讓操作變得繁瑣
  2. background:鎖屏遮罩顏色

    類型:String
    默認:'#FFF'
    說明:請注意這是一個會影響到全局的配置,后續出現的對話框的遮罩顏色都和此設置一樣,再設置不再起作用
  3. opacity:鎖屏遮罩透明度

    類型:Number
    默認:.5
    說明:請注意這是一個會影響到全局的配置,后續出現的對話框的遮罩透明度都和此設置一樣,再設置不再起作用
  4. icon:定義消息圖標

    類型:String
    默認:null
    說明:可定義“skins/icons/”目錄下的圖標名作為參數名(一定要包含后綴名)
  5. titleIcon:標題欄左邊的小圖標

    類型:String
    默認:null
    說明:可定義“skins/icons/”目錄下的圖標名作為參數名(一定要包含后綴名)
  6. padding:內容與邊界填充邊距(即css padding)

    類型:String
    默認:'15px 10px'
    說明:如果內容頁為iframe方式加載的則在css里需要設置為0,要不在IE6中易出問題
  7. skin:多皮膚共存時指定的皮膚樣式

    類型:String
    默認:''
    說明:指定窗口要使用的皮膚的主類名

交互相關

  1. time:設置對話框顯示時間

    類型:Number
    默認:null
    說明:以秒為單位
  2. resize:是否允許用戶調節尺寸

    類型:Boolean
    默認:true
  3. drag:是否允許用戶拖動位置

    類型:Boolean
    默認:true
  4. esc:是否允許用戶按Esc鍵關閉對話框

    類型:Boolean
    默認:true
    說明:只有窗口獲得焦點后才能使用此功能
  5. cache:是否緩存iframe方式加載的窗口內容頁

    類型:Boolean
    默認:true
    說明:只有使用iframe方式加載的單獨頁面的內容時此參數才有效
  6. extendDrag:是否開啟增強拖拽體驗

    類型:Boolean
    默認:true
    說明:1.此屬性為全局性設置,不能在窗口調用的參數里設置,只能使用lhgdialog.setting.extendDrag來設置
         2.防止鼠標落入iframe導致不流暢,對超大對話框拖動優化

高級相關

  1. id:設定對話框唯一標識

    類型:String|Number
    默認:null
    說明:1.防止重復彈出
         2.定義id后可以使用this.get(youID)和lhgdialog.list[youID]獲取擴展方法
  2. zIndex:重置全局zIndex初始值

    類型:Number
    默認:1976
    說明:用來改變對話框疊加高度,請注意這是一個會影響到全局的配置,后續出現的對話框疊加高度將重新按此累加。
  3. init:對話框彈出后執行的函數

    類型:Function
    默認:null
    說明:如果是以iframe方式加載的內容頁此函數會在內容頁加載完成后執行
  4. close:對話框關閉前執行的函數

    類型:Function
    默認:null
    說明:函數如果返回false將阻止對話框關閉。請注意這不是關閉按鈕的回調函數,無論何種方式關閉對話框,close都將執行。
  5. parent:打開子窗口的父窗口對象

    類型:Object
    默認:null
    說明:此參數只用在打開多層窗口都使用遮罩層時才會用到此參數,注意多層窗口鎖屏時一定要加此參數

擴展方法

窗口實例對象內部方法

  1. close():關閉對話框

    參數:無
    說明:在需要關閉窗口時可調用此方法
  2. reload(win,url):刷新或跳轉指定的頁面

    參數1:指定的要刷新或跳轉的頁面的window對象
    參數2:要跳轉到的頁面地址
  3. show():顯示對話框

    參數:無
  4. hide():隱藏對話框

    參數:無
  5. title(value):寫入標題

    參數1:標題的文本
    說明:無參數則返回創建的窗口對象實例
  6. content(value):向窗口中寫入內容

    參數1:窗口中的內容
    說明:如果參數的前3個字符為'url:'參使用iframe方式加載單獨的內容頁,無參數則返回創建的窗口對象實例
  7. button(arguments):插入一個自定義按鈕

    參數1name -- 按鈕名稱
    參數2callback -- 按下后執行的函數
    參數3focus -- 是否聚焦點
    參數4disabled -- 是否標記按鈕為不可用狀態(后續可使用擴展方法讓其恢復可用狀態)
    說明:此參數為多個對象
    示例:
    button({
        name: '登錄',
        focus: true,
        callback: function(){}
    },{
        name: '取消'
    });
  8. position(left,top):重新定位對話框

    參數1X軸的坐標
    參數2Y軸的坐標
    說明:參數可以為數字或帶單位的字符如:'200px'或使用'0%' ~ '100%'作為相對坐標
  9. size(width,height):重新設定對話框大小

    參數1:窗口的寬度
    參數2:窗口的高度
    說明:參數可以為數字或帶單位的字符如:'200px'或使用'0%' ~ '100%'百分值單位
  10. max():最大化窗口

    參數:無
  11. min():最小化窗口

    參數:無
  12. lock():鎖屏

    參數:無
  13. unlock():解鎖

    參數:無
  14. time(val,callback):定時關閉(單位秒)

    參數1:數值,以秒為單位
    參數2:回調函數
    說明:參數2為窗口關閉前執行的函數
  15. focus() :自動設置窗口中焦點元素

    參數:無
  16. zindex() :置頂窗口

    參數:無
  17. get(id,object) :根據指定id獲取相應的對象

    參數1:窗口的id
    參數2:是否返回的是窗口實例對象
    說明:參數2的值只有為數字1時才返回指定id的窗口的實例對象
  18. api:內容頁中調用窗口實例對象接口

    說明:此對象屬性是附加在iframe元素的一個屬性,在iframe方式加載的內容頁中通過調用此函數來獲取窗口的實例對象,示例:var api = frameElement.api; 注:此句代碼是加在iframe方式加載的內容頁中的,一定要注意
  19. opener:加載窗口組件頁面的window對象

    說明:此屬性主要用在iframe方式加載的內容頁中,示例:var api = frameElement.api, W = api.opener; 此時的W即為加載窗口組件頁面的window對象
  20. iframe:iframe方式加載內容的iframe對象

    說明:此屬性主要用於在窗口組件調用頁面操作窗口中的iframe對象
  21. iwin:iframe方式加載內容頁的window對象

    說明:此屬性主要用於在窗口組件調用頁面操作窗口中的window對象,示例:var dg = $.dialog({'url:content.html',init:function(){ if( this.iwin.document.body ) alert('窗口內容頁加載完成'); });

窗口外部方法

  1. $.dialog.focus:獲取焦點的窗口實例對象

    說明:可以使用此屬性獲取兒得焦點的窗口的對象,示例:var dg = $.dialog.focus; 此時的dg就是當前焦點窗口的對象實例
  2. $.dialog.list:所有窗口對象實例的集合

    說明:通過此屬性可獲取所有打開的窗口對象,示例:關閉頁面所有對話框
    var list = $.dialog.list;
    for( var i in list ){
        list[i].close();
    }
  3. $.dialog.top:獲取lhgdialog可用最高層window對象

    說明:這與直接使用window.top不同,它能排除url參數selftrue時定義的頂層頁面為調用窗口組件頁面或者頂層頁面為框架集的情況
  4. $.dialog.data(name,value):跨框架數據共享寫入接口

    參數1:存儲的數據名
    參數2:將要存儲的任意數據(無此項則返回被查詢的數據,如果此值為false就刪除指定名稱的數據)
    說明:框架與框架之間以及與主頁面之間進行數據交換是非常頭疼的事情,常規情況下你必須知道框架的名稱才能進行數據交換,如果是在復雜的多層框架下操作簡直就是噩夢。
    data方法就是為了解決這個問題,你完全不用管框架層級問題,它可以寫入任何類型的數據,而做到各個頁面之間數據共享。

擴展的一些提示性的窗口

  1. $.dialog.alert(content,callback):警告消息

    參數1:內容
    參數2:窗口關閉時執行的回調函數
  2. $.dialog.confirm(content,yes,no):確認

    參數1:內容
    參數2:確定按鈕回調函數
    參數3:取消按鈕回調函數
  3. $.dialog.prompt(content,yes,value):提問

    參數1:內容
    參數2:確定按鈕回調函數
    參數3:文本框默認值
  4. $.dialog.tips(content,time,icon,callback):短暫提示

    參數1:內容
    參數2:顯示時間
    參數3:提示圖標
    參數4:提示關閉時執行的函數
  5. $.dialog.load(url,options,cache):Ajax填充內容

    參數1:地址
    參數2:配置參數
    參數3:是否允許緩存. 默認false


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM