`
berserker_12
  • 浏览: 69101 次
  • 性别: Icon_minigender_1
  • 来自: 广州
文章分类
社区版块
存档分类
最新评论

jQuery File Tree使用笔记

阅读更多

jQuery File Tree 需要用到4个文件

分别为
jquery.js (jquery核心库)
jqueryFileTree.js (jqueryFileTree核心库)
jquery.jqueryFileTree.jsp  (在connection文件夹中 用于JavaScript和jsp的连接,添加列表元素等操作)
jqueryFileTree.css

相关问题与解决

1.中文显示问题
官网中下载的connection并不支持中文,需要做一定修改,jsp中把第一行

引用
<%@ page
import="java.io.File,java.io.FilenameFilter,java.util.Arrays"
<%

改为

<%@ page
import="java.io.File,java.io.FilenameFilter,java.util.Arrays" pageEncoding="utf-8"%>
<%



即可

2.中文文件夹无法打开问题
使用附件中的js文件覆盖原来的文件
其中更改了两个地方,避免使用escape对路径进行编码

3.路径问题
必须使用base标签,如下取得当前的url路径

引用
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>



再通过base标签设置相对路径的参照值

引用
<base href="<%=basePath%>"/>



4、IE中点击文件夹出现的空行问题(转)

(1)打开css文件“jqueryFileTree.css”

(2)修改“UL.jqueryFileTree LI”css项,在其中添加宽度设置(如:“width:100px;”)。

(3)修改完成后再预览应该就可以了。

5.各文件引用方法

引用
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="js/jqueryFileTree.js"></script>
<link href="js/jqueryFileTree.css" rel="stylesheet" type="text/css" media="screen" />

其中jsp页面位于wedapp中,其他文件在wedapp/js中

 

分享到:
评论
2 楼 zhuchong925 2012-05-05  
coolzhi 写道
2.中文文件夹无法打开问题
使用附件中的js文件覆盖原来的文件
其中更改了两个地方,避免使用escape对路径进行编码



试过不行


但只要把escape换成encodeURIComponent就可以了

还是不行额,你能把JS传给我吗?谢谢
1 楼 coolzhi 2011-01-20  
2.中文文件夹无法打开问题
使用附件中的js文件覆盖原来的文件
其中更改了两个地方,避免使用escape对路径进行编码



试过不行


但只要把escape换成encodeURIComponent就可以了

相关推荐

    jquery file tree

    - **初始化插件**:通过 jQuery 的 `.fileTree()` 方法初始化插件,指定服务器路径、文件扩展名筛选、回调函数等参数。 ```javascript $('#filetree').fileTree({ root: '/path/to/root', script: '...

    jqury 文件树jquery.fileTree

    jQuery 文件树(jQuery.fileTree)是一款基于 jQuery JavaScript 库的插件,用于在网页中以树形结构展示文件和目录。这款插件以其简洁、高效和易于定制的特点,深受开发者喜爱,尤其适用于需要用户交互式浏览和选择...

    jQuery File Tree 实用项目

    jQuery File Tree 需要用到4个文件 分别为 jquery.js (jquery核心库) jqueryFileTree.js (jqueryFileTree核心库) jquery.jqueryFileTree.jsp (在connection文件夹中 用于JavaScript和jsp的连接,添加列表...

    json jquery simple tree 源码

    4. **渲染树节点**:使用jQuery Simple Tree的API,将这些JavaScript对象转化为树形结构并显示在页面上。 5. **异步加载**:如果数据量大,可以实现分页或懒加载功能,只在用户展开节点时加载对应子节点的JSON数据,...

    jquery.tree 树

    本文将深入探讨jQuery.tree的使用、功能以及如何在大数据场景下优化性能。 首先,jQuery.tree的核心功能是通过jstree库实现的。jstree是一个轻量级的JavaScript库,提供了一整套完善的API和多种可定制的配置选项,...

    jQuery File Tree 多功能树形菜单插件

    内容索引:脚本资源,jQuery,目录树,树形菜单,jQuery插件 jQuery File Tree 是基于jQuery的多级、多功能树形菜单插件,可以很方便的应用在ASP/PHP/,界面精致,结构与数据分离,自动获取图标格式并调用对应图标显示,...

    扩展了一棵jquery的树插件SimpleTree(jquery.simple.tree.js),支持json数据,checkbox树,以及异步加载,

    **jQuery SimpleTree 插件详解** `jQuery SimpleTree` 是一个功能丰富的JavaScript插件,它扩展了jQuery库,为开发者提供了构建交互式树形结构的能力。这个插件特别之处在于它支持JSON数据格式,可以创建带有复选框...

    jquery checktree

    使用jQuery CheckTree的基本步骤如下: 1. **引入依赖**:确保页面已经包含了jQuery库,然后引入jQuery CheckTree的脚本文件`jquery.checktree.js`。 2. **HTML结构**:创建一个`&lt;ul&gt;`元素作为树的基础,使用`&lt;li&gt;`...

    jquery.tree.js树形导航菜单插件

    《jQuery.tree.js:构建高效树形导航菜单的插件解析》 在网页设计与开发中,树形导航菜单是一种常见的用户界面元素,它能够清晰地展示层级关系,帮助用户更有效地浏览和理解网站结构。jQuery.tree.js是一款专门用于...

    jQuery的Tree控件 jstree

    **jQuery的Tree控件 jstree详解** 在Web开发中,常常需要展示层次结构的数据,例如文件系统、组织架构或导航菜单,这时就需要用到Tree控件。jQuery的jstree插件是一款强大的、可定制化的树形视图库,它能够轻松地将...

    JQuery Tree例子里面包含了JQuery库

    JQuery Tree例子里面包含了JQuery库JQuery Tree例子里面包含了JQuery库JQuery Tree例子里面包含了JQuery库JQuery Tree例子里面包含了JQuery库JQuery Tree例子里面包含了JQuery库

    jquery.tree控件

    **jQuery Tree 控件详解** jQuery Tree控件是一种用于在网页上展示层次结构数据的JavaScript组件,它基于流行的jQuery库构建,提供了丰富的交互性和可定制性。这个控件可以帮助开发者轻松地创建可折叠、可展开的树...

    jquery.checktree.js(添加默认选中功能,补:例子)

    《jQuery Checktree插件的深度解析与应用》 在网页开发中,为了提供用户友好的交互体验,我们经常...理解并掌握这些知识点,将有助于我们在实际开发中更加灵活地使用jQuery Checktree,构建出功能丰富的交互式网页。

    jquery_tree 树形组件

    最后,`example`文件夹通常包含了使用jQuery Tree组件的示例代码。开发者可以通过查看和运行这些示例,快速掌握组件的用法,了解如何初始化树形结构、添加和删除节点、响应用户交互等操作。这些示例对于初学者来说是...

    全网jquery.tree树形菜单打包下载(zTree&jquery-ui&treeview共四种)

    在IT领域,jQuery Tree是一种广泛使用的前端技术,用于创建交互式的树形菜单。这个压缩包包含四个不同的jQuery树形插件:zTree、jQuery UI Treeview、jQuery UI Draggable Tree和jQuery Simple Treeview。这些插件各...

    jQuery jsTree大集合

    3. **初始化jsTree**:使用jQuery选择器获取到容器元素,然后调用`.jstree()`方法进行初始化,设置相应的配置选项。 ```html &lt;div id="jstree"&gt; $(function() { $('#jstree').jstree({ 'core': { 'data': [ {...

    jquery tabletree

    本文将深入解析jQuery TableTree的核心概念、功能特性以及使用方法,帮助开发者更好地理解和应用这一工具。 一、jQuery TableTree概述 jQuery TableTree是一款基于jQuery库的插件,专门用于将普通的HTML表格转换...

Global site tag (gtag.js) - Google Analytics