分类:
前端
layui 实现Tab菜单很简单使用下面的代码即可
<div class="layui-tab" lay-filter="test1"> <ul class="layui-tab-title"> <li class="layui-this" lay-id="111" >文章列表</li> <li lay-id="222">发送信息</li> <li lay-id="333">权限分配</li> <li lay-id="444">审核</li> <li lay-id="555">订单管理</li> </ul> <div class="layui-tab-content"> <div class="layui-tab-item layui-show">1</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>
如果需要绑定事件可以通过lay-filter来绑定事件:
<script> layui.use('element', function(){ var element = layui.element; //监听Tab切换,以改变地址hash值 element.on('tab(test1)', function(){ alert(this.getAttribute('lay-id')); }); }); </script>
然后就可以在改变事件中获取lay-id
欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739
评价