layui 选项卡tab的element事件

发布时间:2023-11-22作者:冰貂主人点击:189

问题描述:

  点击选项后,页面固定在此 tab2上,刷新页面也不跳转到 tab1上。


问题解答:

<div class="layui-tab"  lay-filter="mytab">
          <ul class="layui-tab-title">
            <li class="layui-this" lay-id='1'>百度一言</li>
            <li lay-id='2'>openai</li>                     
          </ul>
          <div class="layui-tab-content">
              <!-- 百度一言 -->
              <div class="layui-tab-item layui-show">百度一言 </div>
            <div class="layui-tab-item ">openai</div>
           </div>
</div>
      layui.use(['element'],function(){        
            var element = layui.element;
              var layid = location.hash.replace(/^#mytab=/, '');
               //假设当前地址为:http://a.com#test1=222,那么选项卡会自动切换到“发送消息”这一项
              element.tabChange('mytab', layid);
                //一些事件触发
              element.on('tab(mytab)', function(data){
                    console.log(this); //当前Tab标题所在的原始DOM元素
                  console.log(data.index); //得到当前Tab的所在下标
                  console.log(data.elem); //得到当前的Tab大容器
                location.hash = 'mytab='+ this.getAttribute('lay-id');
                //或者使用这个 location.hash = 'mytab='+ data.index
              });
     })
标签: