00015-layui 的页签tabs切换,刷新页签的内容

Wmeng0 2020-05-29

<div class="layui-card-body" style="padding:0;"> <div class="layui-tab layui-tab-card" style="margin:0" lay-filter="myTaskTabs"> <ul class="layui-tab-title"> <li class="layui-this">待处理</li> <li>我创建</li> <li>已完成</li> <li>全部</li> </ul> <div class="layui-tab-content" style="padding:0px;"> <div class="layui-tab-item layui-show"> <iframe src="myTaskTodoList.jsp" style="width:100%;height:94%;" frameborder="0" name="iframe0" ></iframe> </div> <div class="layui-tab-item"> <iframe src="myCreateTaskList.jsp" style="width:100%;height:94%;" frameborder="0" name="iframe1" ></iframe> </div> <div class="layui-tab-item"> <iframe src="myTaskDoneList.jsp" style="width:100%;height:94%;" frameborder="0" name="iframe2" ></iframe> </div> <div class="layui-tab-item"> <iframe src="myTaskList.jsp" style="width:100%;height:94%;" frameborder="0" name="iframe3" ></iframe> </div> </div> </div> </div>
<script>
   layui.config({
      base: ‘${ctxLayui}/layuiadmin/‘
   }).extend({
      index: ‘lib/index‘
   }).use([‘index‘, ‘table‘,‘dict‘,‘laydate‘,‘util‘,‘element‘], function(){
      var $ = layui.$,table = layui.table,form = layui.form;
      var dict = layui.dict;
      var laydate = layui.laydate;
      var admin = layui.admin;
      var util = layui.util;

        var element = layui.element;

        element.on(‘tab(myTaskTabs)‘,function (data) {
            var index = data.index;
            var urlArr = [
                ‘myTaskTodoList.jsp‘,
                ‘myCreateTaskList.jsp‘,
                ‘myTaskDoneList.jsp‘,
                ‘myTaskList.jsp‘,
            ];
            layui.$("iframe[name=‘iframe" + index + "‘]").attr("src",urlArr[index]);

        })

   });
</script>

即动态修改 iframe 的src ,页面会重新加载。

相关推荐

89423661 / 0评论 2014-08-29