layui 切换 layui-this

layui-this是layui框架中的一个类，用于标记当前选中的元素。一般情况下，当我们使用layui组件时，需要在多个选项卡或者按钮之间进行切换，此时就需要用到layui-this这个类。

具体实现方式如下：

1. 首先，在需要切换的元素上添加layui-this类，表示该元素是当前选中的元素。

2. 当用户点击其他选项卡或者按钮时，需要通过JavaScript代码切换当前选中的元素。

3. 切换当前选中的元素时，需要将之前的元素的layui-this类移除，然后再将新的元素添加layui-this类。

具体实现代码如下：

HTML代码：

<div class="layui-tab">
  <ul class="layui-tab-title">
    <li class="layui-this">选项卡1</li>
    <li>选项卡2</li>
    <li>选项卡3</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>
</div>

JavaScript代码：

// 获取选项卡标题列表
var tabTitles = $(".layui-tab-title li");
// 给每个选项卡标题添加点击事件
tabTitles.click(function(){
  // 获取当前选中的元素
  var currentTab = $(".layui-this");
  // 将当前选中的元素的layui-this类移除
  currentTab.removeClass("layui-this");
  // 将用户点击的元素添加layui-this类
  $(this).addClass("layui-this");
  // 获取当前选中的选项卡的索引
  var index = $(this).index();
  // 切换选项卡内容
  $(".layui-tab-content .layui-tab-item").eq(index).addClass("layui-show").siblings().removeClass("layui-show");
});

在以上代码中，我们首先获取了选项卡标题列表，然后给每个选项卡标题添加了点击事件。当用户点击选项卡标题时，我们通过JavaScript代码切换当前选中的元素，并根据当前选中的元素的索引值，切换选项卡内容。同时，我们还需要注意将之前选中的元素的layui-this类移除。