關於layer.open彈出層單擊事件如何呼叫父視窗方法的說明
阿新 • • 發佈:2019-01-22
首先,關於layer彈出層的簡介這裡不做贅述,這裡簡單介紹下關於layer.open({ })彈出層中通過單擊事件,來呼叫父視窗方法的實現方式:
簡單介紹:
單刀直入,JS的實現方式可以如下(以單擊“修改密碼”按鈕來彈出layer.open()進行修改密碼為例):
//修改密碼 $("#ChangePWD").on('click', function () { layer.open({ type: 2 , title: '修改密碼' , area: ['390px', '250px'] , skin: 'layer-ext-seaning' , shade: 0.5 , maxmin: false , content: '/Home/ChangePWD' , btn: ['提交', '取消'] , yes: function (layero, index) { var newpsw = window[index.find('iframe')[0]['name']]; newpsw.submit(); } , btn2: function () { var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index); } }) })
簡單介紹:
content: '/Home/ChangePWD' :指專案路徑下的Home目錄中的ChangePWD修改密碼頁面;
btn: ['提交', '取消'] :彈出層中要顯示的按鈕;
yes: function (layero, index) { }:單擊確定按鈕(預設為第一個)觸發的事件,layero為當前層索引,index為當前層DOM物件;
btn2: function () { }:對應“取消”按鈕要觸發的事件。
實現的重點是yes: function (layero, index) { } 這裡,如果彈出層的content裡帶的是一個獨立的頁面,
則在瀏覽器中解析出來的是這個頁面包括在<Ifram></ifram>標籤之中,
所以 var newpsw = window[index.find('iframe')[0]['name']]; 這句話一般情況下幾乎是可以照搬的,這裡我們就把父視窗中的所
有元素賦給了一個物件變數newpsw,而sumit()方法就是父視窗中定義的提交事件,大致如下:
於是,我們就用newpsw.sumit()呼叫了它。
PS:有些人需要在彈出層中加入2個以上的按鈕事件,那麼參照貝btn2的事件定義,我們應該能夠得到啟發。
PS:之所以在這裡敘述以上內容,是因為度娘裡很難找到關於layer.open()呼叫父視窗事件的有效介紹,包括在layer的官網上也都比較費勁,
很難滿足在網上快速有效的查閱此類 資料的需求,特此記之。
以上。