web同一頁面跳轉資料共享——20181130
阿新 • • 發佈：2018-12-06
不同頁面之間跳轉資料共享：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>layui</title> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <link rel="stylesheet" href="layui-v2.4.5/layui/css/layui.css" media="all"> <script src="layui-v2.4.5/layui/layui.js" charset="utf-8"></script> <style> [layui-tab-title]{ float:left; width:18%; } .layui-tab-content{ height:100%; width:100%; top:40px; bottom:0px; position:absolute; } </style> </head> <body> <div class="layui-tab layui-tab-card" lay-filter="test" style="margin-top: 0px;"> <ul class="layui-tab-title"> <li id="layui-tab-title-1" class="layui-this" lay-id="11" layui-tab-title>網站設定</li> <li id="layui-tab-title-2" lay-id="22" layui-tab-title>使用者管理</li> <li id="layui-tab-title-3" lay-id="33" layui-tab-title>許可權分配</li> <li id="layui-tab-title-4" lay-id="44" layui-tab-title>商品管理</li> <li id="layui-tab-title-5" lay-id="55" layui-tab-title>訂單管理</li> </ul> <div class="layui-tab-content"> <div class="layui-tab-item layui-show">點選該Tab的任一標題，觀察位址列變化，再重新整理頁面。選項卡將會自動定位到上一次切換的項 <div id="try"> </div> </div> <div class="layui-tab-item">內容2</div> <div class="layui-tab-item">內容3</div> <div class="layui-tab-item">內容4</div> <div class="layui-tab-item">內容5</div> </div> </div> <script> layui.use('element', function(){ var $ = layui.jquery ,element = layui.element; //Tab的切換功能，切換事件監聽等，需要依賴element模組 //Hash地址的定位 var layid = location.hash.replace(/^#test=/, ''); element.tabChange('test', layid); element.on('tab(test)', function(elem){ location.hash = 'test='+ $(this).attr('lay-id'); }); }); </script> </body> </html>