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

用jQuery实现Tree

    博客分类：
  • ajax
jQueryJavaScriptCSSHTML 
阅读更多

今天用jquery写了一个tree比较简单，所以共享一下。呵呵

<script type="text/javascript" src="lib/jquery/jquery.js">
    </script>
	
	<script language=javascript>
		
		$(function(){
			
			$("li:has(ul)").click(function(e){
				if(e.target==this){
					
					
						$(this).children().toggle();//菜单变换
						
					
				}
				return false;
				
			}).css("cursor","pointer").click();
			
			$("li:not(:has(ul))").css({"cursor":"default","list-style":"none"});
			
		});
		
		
	</script>
	<body>
		
		<ul>
			
			<li>one</li>
						<li>one</li>
									<li>one</li>
									<ul>
										<li>one</li>
										
										<li>one</li>
									</ul>
									<ul>
										<li>one</li>
										
										<li>one</li>
									</ul>
		</ul>
	</body>
</html>

 

4
顶
6
踩
分享到：
| 用jQuery实现Clone
评论
1 楼 bevis.cn 2009-11-19  
能不能弄个图片，共享一下，让大家都看得到效果
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    json jquery simple tree 源码

    在压缩包中的文件"扩展了一棵jquery的树插件SimpleTree，加上了json格式数据异步加载能力 - JQuery - web - JavaEye论坛.htm"可能是讨论这个扩展的论坛帖子或者教程，包含了具体实现的代码示例和使用经验分享。...

    jquery.tree 树

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

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

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

    jquery checktree

    jQuery CheckTree是一个专门用于创建这种功能的插件，它使得在网页上实现可勾选的树形结构变得非常方便。本文将深入探讨jQuery CheckTree的工作原理、主要功能以及如何在项目中进行应用。 首先，让我们了解jQuery ...

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

    jQuery.tree.js是基于jQuery库的一个插件，它利用JavaScript的事件驱动和DOM操作能力，实现了动态生成和管理树形导航菜单的功能。该插件不仅提供了丰富的配置选项，还支持各种交互效果，如点击展开/折叠节点、拖放...

    jquery.tree控件

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

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

    总结起来，jQuery Checktree是一个强大的树形选择工具，通过“jquery.checktree.js”的改进，现在可以实现节点的默认选中，增强了用户体验。配合“checktree.css”和“test.html”，我们可以快速理解和应用这个插件...

    jqury 文件树jquery.fileTree

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

    jquery_tree 树形组件

    Light Treeview是jQuery Tree组件的一种实现，它以其轻量级和简洁的代码著称，适用于那些对性能有较高要求或者希望快速集成的项目。它提供了基本的展开/折叠节点、点击事件处理等核心功能，同时也支持自定义样式，...

    jQUERY TREE

    动态生成树.rar"可能包含了使用jQuery实现树形结构的实例代码，可以解压查看具体实现细节。而"JqueryTree脚本.doc"则可能是关于jQuery Tree的使用指南或教程，包括如何初始化、添加节点、删除节点、展开/折叠节点等...

    jQuery jsTree大集合

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

    jquerytree async 异步

    jQueryTree的异步加载功能主要通过API中的`data-url`属性实现，这个属性可以设置一个URL，当用户展开树形结构的某个节点时，jQueryTree会发送一个Ajax请求到该URL，获取子节点的数据。 **配置异步加载** 在使用...

    jquery tree样式多样

    在IT行业中，jQuery Tree是一种广泛使用的JavaScript库，用于在网页上创建交互式的树形结构，尤其适用于数据组织和导航。jQuery Tree的样式多样性是其一大亮点，它允许开发者根据项目需求定制各种外观和功能，从而...

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

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

    jquery tree层进式导航树

    在IT领域，jQuery Tree是一种广泛使用的交互式层进式导航工具，它允许用户以树状结构展示数据，常用于网站的菜单系统、文件目录浏览或数据分类。此项目基于jQuery UI 1.9.1版本进行改造，适用于那些仍然依赖于这个...

    jquery jstree

    **jQuery jsTree 知识详解** `jQuery jsTree` 是一个...通过熟练掌握jsTree的使用，可以提升项目的用户体验，实现更加直观和便捷的操作。不过，考虑到技术的不断发展，建议使用最新稳定版本以获取最佳性能和兼容性。

    一个精简的jquery生成tree例子

    标签"jquery tree"进一步明确了这个示例的焦点，即使用jQuery来实现树形视图。 文件"jqTree"可能是包含这个例子的源代码或者相关资源。通常，这样的文件可能包括HTML文件用于展示结构，CSS文件用于样式，以及...

    jQuery插件之二：Simple Tree

    为了实现这样的效果，jQuery插件Simple Tree应运而生。它提供了一个轻量级且易于使用的解决方案，帮助开发者快速创建交互式的树形结构。 **一、Simple Tree的基本概念** Simple Tree是基于流行的JavaScript库...

    使用jquery建立tree

    在本篇文章中，我们将深入探讨如何利用jQuery实现这一功能。 首先，理解基本概念。Tree（树）是数据结构的一种，由节点（每个节点包含一个或多个子节点）组成，呈现出层级关系。在HTML页面上，我们可以用`&lt;ul&gt;`和`...

Magicbox
Global site tag (gtag.js) - Google Analytics