亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

layui樹形菜單動態(tài)遍歷的例子

 更新時間:2019年09月23日 08:40:41   作者:何家大少  
今天小編就為大家分享一篇layui樹形菜單動態(tài)遍歷的例子,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧

1、前端jsp頁面

<%@ page language="java" pageEncoding="UTF-8"
contentType="text/html; charset=utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<link rel="stylesheet" href="${pageContext.request.contextPath}/layui/scd/src/css/iconfont.css" rel="external nofollow" />
<script type="text/javascript">
 layui.use(['layer','tree'],function(){
 var layer = layui.layer
   ,$ = layui.jquery; 
 layui.tree({
 elem: '#demo1' //指定元素
 ,click: function(item){ //點擊節(jié)點回調
  if(item.preview!=null){
   var index = layer.open({
   type: 2,
   title: item.name,
   content:"/varietySystem/"+item.preview
  });
  layer.full(index);
  $(window).on("resize",function(){
   layer.full(index);
  });
  }
 },
 nodes: [ //節(jié)點
  {
  name: '申請文件'
  ,id: 1
  ,alias: 'shenqingwenjian'
  ,spread: true //默認展開
  ,children:function(){
  var arr = [];
   <c:forEach items="${applyRequestList}" var="applyRequest">
    <c:if test="${applyRequest.state == null }">
     arr.push({
       name:"請求書"
       ,preview: 'firstReceiveTree/toApplyRequestInfo/${applyRequest.idpk}'
     });
     </c:if>
     <c:if test="${applyRequest.state != null}">
      arr.push({
       name:"請求書 <fmt:formatDate value="${applyRequest.correcttime}" pattern="yyyyMMdd" />"
       ,preview: 'firstReceiveTree/toApplyRequestInfo/${applyRequest.idpk}'
     });
    </c:if>
    </c:forEach>
   return arr;
  }()
  },
  {
  name: '中間文件'
  ,id: 1
  ,alias: 'zhongjianwenjian'
  ,children:function(){
    var arr = [];
    <c:forEach items="${StatementAndCorrection}" var="StatementAndCorrection">
     <c:if test="${StatementAndCorrection.type==0}">
      arr.push({
       name:"意見陳述書 <fmt:formatDate value="${StatementAndCorrection.submittime}" pattern="yyyyMMdd" />"
       ,preview: 'statementOpinion/preview?idpk=${StatementAndCorrection.typeid}'
     });
    </c:if>
    </c:forEach>
    return arr;
    }()
  },
  {
  name: '通知書'
  ,id: 1
  ,alias: 'tongzhishu'
  ,children:function(){
   var arr = [];
   <c:if test="${not empty formalityNoticeList}">
    <c:forEach items="${formalityNoticeList}" var="formalityNotice">
      arr.push({
      name:"手續(xù)合格通知書 <fmt:formatDate value="${formalityNotice.datewriting}" pattern="yyyyMMdd" />"
      ,preview: 'formalityNotice/noticeInfo/${formalityNotice.idpk}'
     });
    </c:forEach>
   </c:if>
   return arr;
  }()
  }
  ]
 });
});
</script>
<table class="layui-table free_tree" >
 <tbody>
  <tr>
   <td style="background: #fff;padding:0px;">
    <div style="width:240px;position:relative; max-height:545px; overflow:auto;" >
     <ul id="demo1"></ul>
    </div>
   </td>
  </tr>
 </tbody>
</table>
<style>
 #demo1>li{
  background: #f2f2f2;
 padding: 4px 0 0 5px;
 border-bottom: 1px solid #e6e6e6;
 line-height:25px;
 }
 #demo1>li:last-child{
  border-bottom:none;
 }
 #demo1>li>a{
 padding-bottom: 4px;
 }
 #demo1>li ul{
  background: #fff;
  margin-left:-5px;
 }
 #demo1>li ul>li{
 border-bottom: 1px solid #e6e6e6;
 /*padding: 4px 0px 3px 27px;*/
 padding: 4px 0px 3px 6px;
 }
 #demo1>li ul li:first-child{
  border-top:1px solid #e6e6e6;
 }
 #demo1>li ul>li:last-child{
  border-bottom:none;
 }
 .layui-tree li i {
 padding-left: 3px;
 }
 .layui-tree li a cite{
  padding: 0 3px;
 }
 #demo1>li ul>li a cite{
  font-size:8px;
 }
 #demo1>li ul>li:hover{
  background: #f2f2f2;
 }
 .free_tree_style{
  margin-left:241px;
 }
</style>

以上這篇layui樹形菜單動態(tài)遍歷的例子就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。

相關文章

  • TypeScript中使用getElementXXX()的示例代碼

    TypeScript中使用getElementXXX()的示例代碼

    這篇文章主要介紹了TypeScript中使用getElementXXX()的示例代碼,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2019-09-09
  • js版掃雷實現(xiàn)代碼 原理不錯

    js版掃雷實現(xiàn)代碼 原理不錯

    前一段時間在圖書館看了本關于JavaScript的書,上面講怎樣用js編推箱子小游戲。我想,那掃雷也當然能編出來,然后就用DW試了試,結果如下。
    2009-11-11
  • 淺析如何利用JavaScript進行語音識別

    淺析如何利用JavaScript進行語音識別

    所謂語音識別就是將你所說的轉化成文字。Chrome 瀏覽器在版本25之后開始對這一特性的支持。這篇文章將會詳細的介紹如何使用JavaScript進行語音識別,感興趣的朋友們可以參考借鑒,下面來一起看看吧。
    2016-10-10
  • JS選項卡動態(tài)替換banner圖片路徑的方法

    JS選項卡動態(tài)替換banner圖片路徑的方法

    這篇文章主要介紹了JS選項卡動態(tài)替換banner圖片路徑的方法,涉及javascript操作文件css樣式的相關技巧,非常簡單實用,需要的朋友可以參考下
    2015-05-05
  • JS中三種URI編碼方式對比分析

    JS中三種URI編碼方式對比分析

    這篇文章主要介紹了JS中三種URI編碼方式對比分析,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友參考下吧
    2024-01-01
  • JavaScript canvas實現(xiàn)鏡像圖片效果

    JavaScript canvas實現(xiàn)鏡像圖片效果

    這篇文章主要為大家詳細介紹了JavaScript canvas實現(xiàn)鏡像圖片效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2021-08-08
  • 24個解決實際問題的ES6代碼片段(小結)

    24個解決實際問題的ES6代碼片段(小結)

    這篇文章主要介紹了24個解決實際問題的ES6代碼片段,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2020-02-02
  • ES6新數(shù)據(jù)結構Set與WeakSet用法分析

    ES6新數(shù)據(jù)結構Set與WeakSet用法分析

    這篇文章主要介紹了ES6新數(shù)據(jù)結構Set與WeakSet用法,結合實例形式簡單分析了Set與WeakSet的功能、使用方法及相關注意事項,需要的朋友可以參考下
    2017-03-03
  • 基于JS實現(xiàn)發(fā)送驗證碼的計時器效果

    基于JS實現(xiàn)發(fā)送驗證碼的計時器效果

    這篇文章主要為大家詳細介紹了如何基于JS實現(xiàn)一個發(fā)送驗證碼的計時器效果,文中的示例代碼講解詳細,感興趣的小伙伴快跟隨小編一起學習一下吧
    2023-11-11
  • JavaScript實現(xiàn)省市聯(lián)動過程中bug的解決方法

    JavaScript實現(xiàn)省市聯(lián)動過程中bug的解決方法

    這篇文章主要為大家詳細介紹了解決JavaScript實現(xiàn)省市聯(lián)動過程中的bug,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-12-12

最新評論