体彩排列5双期走势图

站长网_站长创业_站长主页_站长之家_易采站长站

会员投稿 投稿指南 站长资讯通告: jquery zTree异步加载简单实例讲解
搜索:
您的位置: 主页 > 教程 > 网页编程 > JavaScript > » 正文

jquery zTree异步加载简单实例讲解

来源: 易采站长站

本文实例讲解了jquery zTree异步加载,分享给大家供大家参考,具体内容如下

web.xml中Servlet配置如下:

<?xml version="1.0" encoding="UTF-8"?> 
<web-app version="2.4"  
  xmlns="http://java.sun.com/xml/ns/j2ee"  
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  
  xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee  
  http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> 
   
   
  <servlet> 
    <servlet-name>getDataServlet</servlet-name>;  
    <servlet-class>testTree.TestTree</servlet-class>;  
  </servlet> 
   
  <servlet-mapping> 
  <servlet-name>getDataServlet</servlet-name>;  
  <url-pattern>/getData</url-pattern>;  
  </servlet-mapping> 
 
</web-app> 

JSP页面:

<!DOCTYPE html> 
<HTML> 
<HEAD> 
  <TITLE> ZTREE DEMO - Simple Data</TITLE> 
  <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
  <link rel="stylesheet" href="css/demo.css" type="text/css"> 
  <link rel="stylesheet" href="css/zTreeStyle/zTreeStyle.css" type="text/css"> 
  <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> 
  <script type="text/javascript" src="js/jquery.ztree.core-3.2.js"></script> 
  <script type="text/javascript" src="js/jquery.ztree.excheck-3.2.js"></script> 
  <script type="text/javascript" src="js/jquery.ztree.exedit-3.2.js"></script> 
  <SCRIPT type="text/javascript"> 
    <!-- 
    var setting = { 
      data: { 
        simpleData: { 
          enable: true 
        } 
      } 
      ,async: { 
        enable: true, 
        url:"/testJQuery/getData", 
        autoParam:["id", "name"], 
        otherParam:{"otherParam":"zTreeAsyncTest"}, 
        dataFilter: filter 
      } 
    }; 
    function filter(treeId, parentNode, childNodes) { 
      if (!childNodes) return null; 
      for (var i=0, l=childNodes.length; i<l; i++) { 
        childNodes[i].name = childNodes[i].name.replace('',''); 
      } 
      return childNodes; 
    } 
    var zNodes =[ 
      { id:1, pId:0, name:"parentNode 1", open:true}, 
      { id:11, pId:1, name:"parentNode 11"}, 
      { id:111, pId:11, name:"leafNode 111"}, 
      { id:112, pId:11, name:"leafNode 112"}, 
      { id:113, pId:11, name:"leafNode 113"}, 
      { id:114, pId:11, name:"leafNode 114"}, 
      { id:12, pId:1, name:"parentNode 12"}, 
      { id:121, pId:12, name:"leafNode 121"}, 
      { id:122, pId:12, name:"leafNode 122"}, 
      { id:123, pId:12, name:"leafNode 123"}, 
      { id:13, pId:1, name:"parentNode 13", isParent:true}, 
      { id:2, pId:0, name:"parentNode 2", isParent:true} 
    ]; 
 
    $(document).ready(function(){ 
      $.fn.zTree.init($("#treeDemo"), setting, zNodes); 
    }); 
    //--> 
  </SCRIPT> 
 </HEAD> 
 
<BODY> 
<h1>最简单的树 -- 简单 JSON 数据</h1> 
<h6>[ 文件路径: core/simpleData.html ]</h6> 
<div class="content_wrap"> 
  <div class="zTreeDemoBackground left"> 
    <ul id="treeDemo" class="ztree"></ul> 
  </div> 
</div> 
</BODY> 
</HTML>
            
Tags:
最新图文资讯
1 2 3 4 5 6
体彩排列5双期走势图相关的文章列表:
易采站长站 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助 -
体彩七星彩大小分析 排列三和值走势图 华东15选5除五走势图 体彩超级大乐透除八走势图 七乐彩复式投注及中奖金额计算表 河北福彩20选5除五走势图 福彩双色球红球尾数走势图 江苏体彩七位数号码分布 河南福彩22选5走势图 江苏体彩七位数奇偶走势图 体彩排列5大小分析 体彩排列3奇偶分析 福彩双色球双期走势图 河南福彩22选5尾数和走势图 河南福彩22选5尾数和走势图 齐鲁风采23选5走势图 体彩七星彩单期走势图 华东15选5单期走势图 江苏体彩七位数和值走势图 河北福彩20选5走势图