獲取layer.open彈出層的返回值方法
正在開發(fā)的車聯(lián)網(wǎng)項(xiàng)目用到了layer API。當(dāng)我在開發(fā)“新建電子圍欄”的時(shí)候需要彈出地圖,用戶在地圖中畫一個(gè)區(qū)域,最后將這個(gè)彈出層的數(shù)據(jù)返回給原頁(yè)面。下面是我的實(shí)現(xiàn)過(guò):程:
觸發(fā)彈出層的代碼:
layer.open({ type: 2, title: "設(shè)置圍欄", shadeClose: true, shade: 0.4, area: ['90%', '90%'], content: "/ElectronicFence/Map?id=" + id + "&shapeType=" + shapeType, btn: ['確定','關(guān)閉'], yes: function(index){ //當(dāng)點(diǎn)擊‘確定'按鈕的時(shí)候,獲取彈出層返回的值 var res = window["layui-layer-iframe" + index].callbackdata(); //打印返回的值,看是否有我們想返回的值。 console.log(res); //最后關(guān)閉彈出層 layer.close(index); }, cancel: function(){ //右上角關(guān)閉回調(diào) } });
注意:
var res = window["layui-layer-iframe" + index].callbackdata();
這行代碼中‘callbackdata'是彈出層里面定義的函數(shù)。也許我們知道了什么!這個(gè)函數(shù)的作用就是返回值。
彈出層中定義返回值的函數(shù):
<script type="text/javascript"> var map = new AMap.Map("container", { resizeEnable: true }); //在地圖中添加MouseTool插件 var mouseTool = new AMap.MouseTool(map); AMap.event.addDomListener(document.getElementById('point'), 'click', function () { mouseTool.marker({ offset: new AMap.Pixel(-14, -11) }); }, false); AMap.event.addDomListener(document.getElementById('line'), 'click', function () { mouseTool.polyline(); }, false); AMap.event.addDomListener(document.getElementById('polygon'), 'click', function () { mouseTool.polygon(); }, false); var callbackdata = function () { var data = { username: 'zhangfj' }; return data; } </script>
上面的代碼就是彈出層里面的JavaScript代碼,里面定義了函數(shù)'callbackdata' 用來(lái)返回值給調(diào)用彈出層的頁(yè)面。
當(dāng)我們點(diǎn)擊彈出層的“確定”按鈕的時(shí)候,就可以通過(guò)'callbackdata'函數(shù)獲取彈出層的返回值:
F12 查看console.log(res);的輸出結(jié)果:
以上這篇獲取layer.open彈出層的返回值方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
javascript 數(shù)組精簡(jiǎn)技巧小結(jié)
本文給大家分享了13個(gè)非常常用的JavaScript數(shù)組操作的小技巧,有需要的小伙伴可以來(lái)看看,個(gè)人十分推薦.2020-02-02Javascript 顏色漸變效果的實(shí)現(xiàn)代碼
在搭建博主博客的時(shí)候,尋思著做一些效果,看到菜單,就想是不是可以做一下顏色的漸變,增加一點(diǎn)動(dòng)態(tài)的感覺(jué)。有個(gè)jquery的插件,效果相當(dāng)不錯(cuò),不過(guò)博主還是打算自立更生寫一下,看看能不能實(shí)現(xiàn)2013-10-10Javascript匿名函數(shù)的一種應(yīng)用 代碼封裝
說(shuō)實(shí)話,對(duì)于js初學(xué)者的我來(lái)說(shuō)。這個(gè)東西太嚇人了,在這些JS庫(kù)中,這個(gè)函數(shù)基本上把整個(gè)庫(kù)的所有代碼全括起來(lái)了,這種寫法完全超越了我的常識(shí)。2010-06-06JS 正則表達(dá)式驗(yàn)證密碼、郵箱格式的實(shí)例代碼
這篇文章主要介紹了JS 正則表達(dá)式驗(yàn)證密碼、郵箱格式的實(shí)例代碼,需要的朋友可以參考下2018-10-10JavaScript 對(duì)象合并的幾種方法小結(jié)
本文主要介紹了JavaScript 對(duì)象合并的幾種方法小結(jié),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-02-02微信小程序開發(fā)的四十個(gè)技術(shù)竅門總結(jié)(推薦)
這篇文章主要給大家介紹了微信小程序開發(fā)的四十個(gè)技術(shù)竅門的相關(guān)資料,相信對(duì)大家的學(xué)習(xí)或者使用微信小程序具有一定的參考借鑒價(jià)值,所以特別推薦給大家,需要的朋友們可以一起來(lái)看看吧。2017-01-01javascript table美化鼠標(biāo)滑動(dòng)單元格變色
效果非常不錯(cuò)的table美化,當(dāng)鼠標(biāo)滑過(guò)去,背景色變換效果2008-06-06在線編輯器的實(shí)現(xiàn)原理(兼容IE和FireFox)
在線編輯器的實(shí)現(xiàn)原理(兼容IE和FireFox)...2007-03-03