這篇文章主要介紹“怎么在O2OA中使用系統o2.DL構建彈出框”，在日常操作中，相信很多人在怎么在O2OA中使用系統o2.DL構建彈出框問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”怎么在O2OA中使用系統o2.DL構建彈出框”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！

陵城網站制作公司哪家好，找創(chuàng)新互聯！從網頁設計、網站建設、微信開發(fā)、APP開發(fā)、成都響應式網站建設公司等網站項目制作，到程序開發(fā)，運營維護。創(chuàng)新互聯從2013年創(chuàng)立到現在10年的時間，我們擁有了豐富的建站經驗和運維經驗，來保證我們的工作的順利進行。專注于網站建設就選創(chuàng)新互聯。

1、使用O2OA平臺封裝好對象o2.DL的open方法創(chuàng)建彈出層，傳入options參數構建彈出框內容、按鈕等元素

實現效果：

對象源代碼位置：o2server\o2web\source\o2_core\o2\xDesktop\Dialog.js,

該對象繼承至o2.widget.Dialog，源代碼位置：o2server\o2web\source\o2_core\o2\widget\Dialog.js

實現代碼如下：

var dialog = o2.DL.open({

"style" : "o2",

"title": "彈出框標題",

"width": "400",

"height" : "200",

"isMax": false,

"isClose": true,

"isResize": true,

"isMove": true,

"isTitle": true,

"offset": {"x":-200, "y": -100},

"mask": true,

"content": new Element("div"),

"container": this.form.getApp().content,

"duration": 200,

"buttonList": [

{

"text": "確定",

"action": function(){

var result = {"key":"value"};

if (callback) callback.apply(this, [result]);

dialog.close();

}.bind(this)

},

{

"text": "取消",

"action": function(){

dialog.close();

}.bind(this)

}

],

"onQueryClose": function(){

console.log("-onQueryClose-");

}.bind(this),

"onPostClose": function(){

console.log("-onPostClose-");

}.bind(this),

"onQueryLoad":function(){

console.log("-onQueryLoad-");

},

"onPostLoad": function(){

console.log("-onPostLoad-");

new Element("div",{text:"這是內容區(qū)域"}).inject(this.content);

// ...code...

},

"onQueryShow": function(){

console.log("-onQueryshow-");

},

"onPostShow": function(){

console.log("-onPostShow-");

}.bind(this)

})

2、主要參數說明

1)、style：彈出框使用的樣式，默認是default，系統內置一些樣式，比如：flat,o2,chartd等，對應樣式文件位置路勁：o2server\o2web\source\o2_core\o2\widget\$Dialog，用戶也可以自己增加自定義樣式風格，對應文件及結構參考已有樣式風格。

2)、title：彈出框頭部標題，在isTitle參數為true時有效。

3)、width：彈出框寬度。 默認值：300

4)、height：彈出框高度。 默認值：150

5)、isMax：標題欄是否有大化按鈕，相對應有還原按鈕，默認值：false

6)、isClose：標題欄是否有關閉按鈕。默認值：false

7)、isResize：彈出框大小是否可調整。默認值：true

8)、isMove：彈出框是否可移動。默認值：true

9)、isTitle：是否顯示標題欄。默認值：true

10)、offset：彈出框相對默認x軸y軸位置

11)、mark：是否需要遮罩層。默認值：true

12)、content：彈出框層的容器。

13)、container：彈出框層dom對象需要插入頁面html內元素的位置，默認插入到body中。

14)、duration：動畫顯示彈出框效果時間。默認值：200

15)、buttonList：定義底部按鈕，比如“確認”，“關閉”按鈕等，數組列表。text：按鈕顯示名稱，action：                按鈕對應的點擊事件

16)、onQueryClose：關閉彈出框前事件

17)、onPostClose：關閉彈出框后事件

18)、onQueryLoad：彈出框載入前事件

19)、onPostLoad：彈出框載入后事件

20)、onQueryShow：彈出框顯示前事件

21)、onPostShow：彈出框顯示后事件

3、其他注意事項及說明

1)、調用彈出框對象后各事件執(zhí)行先手順序 onQueryLoad-->onPostLoad-->onQueryShow-->onPostShow

2)、彈出框傳值問題，通過apply方法，在關閉彈出框后把值通過回調方法傳到外部調用的對象中。

3)、除了以上列出的一些常用參數及方法外，可以查看widget\Dialog.js源代碼文件中其他內置的參數及方法。

比如setContentSize(),設置居中，reCenter()重新設置居中位置等方法。

4)、可以自定義一個dialog類設置繼承widget.dialog重寫內置方法，滿足特殊的業(yè)務要求

到此，關于“怎么在O2OA中使用系統o2.DL構建彈出框”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續(xù)學習更多相關知識，請繼續(xù)關注創(chuàng)新互聯-成都網站建設公司網站，小編會繼續(xù)努力為大家?guī)砀鄬嵱玫奈恼拢?/p>

標題名稱：怎么在O2OA中使用系統o2.DL構建彈出框-創(chuàng)新互聯
新聞來源：http://www.chinadenli.net/article42/desjec.html

成都網站建設公司_創(chuàng)新互聯，為您提供外貿網站建設、網站收錄、網站排名、虛擬主機、企業(yè)網站制作、網站營銷

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯