使用Layui-admin作後臺管理框架有很長的一段時間了,可是一直沒有對框架內iframe菜單欄切換跳轉作深刻的瞭解。今天有一個這樣的需求就是經過獲取超連接中傳遞過來的跳轉地址和對應的tabs的title名稱參數,在layui-admin-iframe中自動打開一個新的tabs頁面,不須要點擊左邊的菜單欄,實現一個單頁面的效果。javascript
https://xxxx.xxx.com?transferUrl=/Home/Index&openTabsName=首頁java
其中transferUrl:爲須要打開的頁面地址框架
openTabsName:爲tabs標題名稱ui
//layui預先加載 layui.use('index', function(){ var transferUrl =getQueryVariable("tabName"); var openTabsName =getQueryVariable("name"); //初始化頁面調轉 layui.index.openTabsPage(transferUrl,openTabsName); })
如獲取超連接[https://xxxx.xxx.com?transferUrl=/Home/Index&openTabsName=首頁] 中的transferUrl和openTabsName中的值 編碼
function getQueryVariable(variable) { var query = window.location.search.substring(1); console.log(decodeURIComponent(query));//js解碼(超連接中的中文獲取時可能存在編碼的狀況) var vars = query.split("&"); for (var i=0;i<vars.length;i++) { var pair = vars[i].split("="); if(pair[0] == variable){return decodeURIComponent(pair[1]);} } return(false); }
咱們能夠在導航欄中設置左側菜單導航欄默認展開的屬性,以下所示:spa
layui-nav-itemed的屬性默認導航所有展開
<li class="layui-nav-item layui-nav-itemed">
</li>
效果圖,以下所示:3d