
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。有需要软件开发,或者学习软件技术的朋友可以和我联系~(Q:815170684)
评价
排名
9
文章
115
粉丝
5
评论
5
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:
50010702506256


欢迎加群交流技术