layui tab选项卡Hash地址的定位和跳转到指定tab栏

您所在的位置:网站首页 layui刷新指定tab layui tab选项卡Hash地址的定位和跳转到指定tab栏

layui tab选项卡Hash地址的定位和跳转到指定tab栏

2023-07-28 13:35| 来源: 网络整理| 查看: 265

Hash地址的定位,页面改变某一选项区中的内容后,其他内容同步刷新,内容选项定位在指定的区域;

html:

11111 22222 33333 44444 aaaaa bbbbb ccccc ddddd

js

// layui.use(['form', 'layer', 'table', 'laytpl', 'laydate', 'element'], function() { // var form = layui.form, // layer = layui.layer, // $ = layui.jquery, // laytpl = layui.laytpl, // table = layui.table, // element = layui.element; // 参数多,这里只用到element //Hash地址的定位 layui.use('element', function(){ var $ = layui.jquery ,element = layui.element; //切换,事件监听等,需要依赖element模块 var layid = location.hash.replace(/^#test=/, ''); // lay-filter="test" 地址栏中参数的名称; // layid作为唯一的匹配索引,以用于外部的定位切换 element.tabChange('test', layid); //1:element.tabChange(filter, layid); 用于外部切换到指定的Tab项上,参数同上 element.on('tab(test)', function(elem){ //2:element.on(filter, callback); 用于元素的一些事件监听,以改变地址hash值 location.hash = 'test='+ $(this).attr('lay-id'); }); });

跳转到指定tab栏:http://a.com#now=22,选项卡会自动切换到当前项

 



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3