标签：index tabs layui element 00015 jsp var table

<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 ,页面会重新加载。

标签：index,tabs,layui,element,00015,jsp,var,table
来源： https://www.cnblogs.com/jianquan100/p/12984169.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。