說到彈窗,在jeecg中彈窗用到最多的地方無非是新增/編輯的彈窗。
1.列表頁面新增編輯按鈕觸發的彈窗即lhgdialog,不論是add/update,最終走的都是curdtools.js中的createwindow
核心**:
var mydialog = $.dialog(,
okval: $.i18n.prop('dialog.submit'),
cancelval: $.i18n.prop('dialog.close'),
cancel: true /*為true等價於function(){}*/
});可以查閱官方api了解每個引數的意義:
此處只解釋乙個屬性:content: 'url:'+addurl
如果addurl傳入的位址指向了乙個頁面,那麼這個新的頁面內容會以iframe的形式載入出來(需要注意的是彈窗本身並非iframe),那麼正題來了,既然他的真面目是iframe,那麼涉及iframe的傳值、方法呼叫用在此處均可。
a.父頁面呼叫子頁面的方法 $("#iframeid")[0].contentwindow.childmethod(); 通過獲取iframe的js物件呼叫其contentwindow.子頁面的方法
b.子頁面呼叫父頁面的方法 parent.parentmethod();
其實查閱lhgdialog api可以發現類似的的呼叫方法:
api:內容頁中呼叫視窗例項物件介面
說明:此物件屬性是附加在iframe元素的乙個屬性,在iframe方式載入的內容頁中通過呼叫此函式來獲取視窗的例項物件,示例:var api = frameelement.api; 注:此句**是加在iframe方式載入的內容頁中的,一定要注意
opener:載入視窗元件頁面的window物件
說明:此屬性主要用在iframe方式載入的內容頁中,示例:var api = frameelement.api, w = api.opener; 此時的w即為載入視窗元件頁面的window物件
iframe:iframe方式載入內容的iframe物件
說明:此屬性主要用於在視窗元件呼叫頁面操作視窗中的iframe物件
content:iframe方式載入內容頁的window物件
說明:此屬性主要用於在視窗元件呼叫頁面操作視窗中的window物件,示例:var dg = $.dialog();
2.說完js接下來需要探索一下css的修改,因為此彈窗的樣式被改造過,所以按照官方文件可能有時達不到想要的效果,
1.每種風格有不同的樣式效果,檢視basetag**,可知每種風格下會引入哪些樣式。
2.找到對應base中引入的skin-css,修改樣式:
jeecg之彈窗外掛程式lhgdialog小結
說到彈窗,在jeecg中彈窗用到最多的地方無非是新增 編輯的彈窗。1.列表頁面新增編輯按鈕觸發的彈窗即lhgdialog,不論是add update,最終走的都是curdtools.js中的createwindow 核心 12 3456 78910 1112 1314 1516 1718 var m...
vue彈窗外掛程式實戰
vue做移動端經常碰到彈窗的需求,這裡寫乙個功能簡單的vue彈窗 元件html結構,外層divposition fixed定位,內層div顯示彈窗內容 export default time data methods this.time hide popup.vue只有2個屬性 文字和顯示時間。元件...
vue彈窗外掛程式實戰
vue做移動端經常碰到彈窗的需求,這裡寫乙個功能簡單的vue彈窗 元件html結構,外層divposition fixed定位,內層div顯示彈窗內容 export default time data methods this.time hide popup.vue只有2個屬性 文字和顯示時間。元件...