layui tab 切换 条件判定 刷新当前tab

新建一个tab

        <div class="layui-tab layui-tab-brief" lay-filter="tab-title">
            <ul class="layui-tab-title">
                <li class="layui-this" lay-id="1" data-val="1">1</li>
                <li lay-id="2" data-val="1">2</li>
                <li lay-id="3" data-val="1">3</li>   
                <li lay-id="4" data-val="1">4</li> 
                <li lay-id="5" data-val="1">5</li> 
            </ul>
              <div class="layui-tab-item" id="mode2">
              </div>
              <div class="layui-tab-item" id="mode2">
              </div>
              <div class="layui-tab-item" id="mode3">
              </div>
              <div class="layui-tab-item" id="mode4"  >
              </div>
              <div class="layui-tab-item" id="mode5"  >
              </div>
          </div>

监听tab

    layui.use(['form','layer','laydate','layedit','element','upload','xmSelect'],function(){
        var form = layui.form,
            layer = layui.layer,
            layedit = layui.layedit,
            element = layui.element,

        $ = layui.jquery

            //监听Tab切换,以改变地址hash值
            element.on('tab(tab-title)', function(){
                layid = this.getAttribute('lay-id');
                statusId = this.getAttribute('data-val');
                
                //获取条件
                goodsid = $("#data-id").val();
      
                var layid_up = layid - 1;

                if(layid_up && goodsid == ""){

                    layer.msg("条件不满足", {
                        time : 3000,
                        icon : 10 
                    });   
                    _tabChange('tab-title',layid_up);
                    return false;
                }else if(goodsid != "" && layid == 2 && statusId == 1){ 
                    this.setAttribute('data-val',2);
                    $.ajax({
                        url:"{:url('ShopJourneyData/read')}",
                        data:{
                            id:goodsid
                        },
                        success:function(res){
                            $("#mode2").append(res);
                        }
                    })
                    return false;
                }else if(goodsid != "" && layid == 3 && statusId == 1){
                    this.setAttribute('data-val',2);
                    $.ajax({
                        url:"{:url('ShopProduct/read_journey')}",
                        data:{
                            id:goodsid
                        },
                        success:function(res){
                            $("#mode3").append(res);
                        }
                    })
                    return false;              
                }else if(goodsid != "" && layid == 4 && statusId == 1){
                    this.setAttribute('data-val',2);
                    $.ajax({
                        url:"{:url('ShopProduct/read_notice')}",
                        data:{
                            id:goodsid
                        },
                        success:function(res){     
                            $("#mode4").append(res);
                        }
                    })
                    return false;              
                }else if(goodsid != "" && layid == 5 && statusId == 1){
                    this.setAttribute('data-val',2);
                    $.ajax({
                        url:"{:url('ShopProduct/read_contract')}",
                        data:{
                            id:goodsid
                        },
                        success:function(res){     
                            $("#mode5").append(res);
                        }
                    })
                    return false;              
                }
                    return false;
            });

            function _tabChange(filter,layid){
                element.tabChange(filter, layid);
            }

      })

刷新tab当前页面

        //重新渲染页面
        window.applyJourney = function(){
            var goodsid = $("#data-id").val();

            $.ajax({
                url:"{:url('ShopJourneyData/read')}",
                data:{
                    id:goodsid
                },
                success:function(res){
                    $("#mode2").empty().append(res);
                }
            })
        }
原文地址:https://www.cnblogs.com/corvus/p/14262049.html