`
dws_202
  • 浏览: 9778 次
  • 性别: Icon_minigender_1
  • 来自: 太原
社区版块
存档分类
最新评论

jQuery-option-tree联动下拉框

阅读更多

挺好用的jquery实现联动下拉框:

<html>
	<head>   
		 
		<script type="text/javascript" src="jquery-1.6.2.js"></script>
		<script type="text/javascript" src="jquery.optionTree.js"></script>    
		

	</head> 

	<body>
	<h3>Demo1</h3>
		<input type="text" name="demo1" />
		<script type="text/javascript">
			$(function() {

				var option_tree = {
				   "Option 1": {"Suboption":200},
				   "Option 2": {"Suboption 2": {"Subsub 1":201, "Subsub 2":202},
							"Suboption 3": {"Subsub 3":203, "Subsub 4":204, "Subsub 5":205}
						   }
				};

				$('input[name=demo1]').optionTree(option_tree);

			});
		</script>

		<br>
		<h3>Demo2</h3>
		<input type="text" name="demo2" />
		<script type="text/javascript">
			var option_tree = {
			   "Option 1": {"Suboption":200},
			   "Option 2": {"Suboption 2": {"Subsub 1":201, "Subsub 2":202},
						"Suboption 3": {"Subsub 3":203, "Subsub 4":204, "Subsub 5":205}
					   }
			};

			var options = {empty_value: -1, choose: '...select'};

			$('input[name=demo2]').optionTree(option_tree, options)
								 ;
		</script>

	</body>
</html>

 

还有其他demo,ajax实现等参看连接:

http://code.google.com/p/jquery-option-tree/

分享到:
评论

相关推荐

    jQuery联动下拉框 jQuery optionTree

    optionTree插件是基于jQuery的一个扩展,它的设计目标是构建具有层级结构的联动下拉框。在一些复杂的表单中,比如地区选择、产品分类等,往往需要展示一种树状的层次关系,这时optionTree就能发挥出它的优势。它不仅...

    jquery-下拉框down

    本文将深入探讨“jquery-下拉框down”这一主题,它主要涉及如何利用jQuery来实现动态下拉框功能,以及相关的文件`jquery-mcdropdown`可能包含的内容。 1. **jQuery下拉框基础** 在HTML中,下拉框通常由`&lt;select&gt;`...

    jquery--下拉框的实现

    本篇文章将详细探讨如何利用jQuery来实现下拉框的功能,这对于创建交互式用户界面是至关重要的。 首先,下拉框在HTML中通常被称为`&lt;select&gt;`元素,它允许用户从一组预定义的选项中进行选择。在jQuery中,我们可以...

    layui-省市县三级联动下拉框-HTML源码

    本文将详细介绍如何使用HTML、JavaScript(通常配合jQuery)以及可能涉及的CSS来实现"layui-省市县三级联动下拉框"的功能,并探讨其可扩展性。 首先,`layui`是一个流行的前端UI框架,它提供了一套美观、响应式的...

    jQuery-searchableSelect下拉框搜索插件

    **jQuery-searchableSelect下拉框搜索插件** 在网页开发中,下拉框(Dropdown List)是常见的交互元素,用于提供用户多个选择项。然而,当选项过多时,用户查找所需选项可能会变得困难。为了解决这个问题,`jQuery-...

    JQuery 年月日三级下拉框联动

    一个直制的JQuery 年月日三级下拉框联动 使用方法非常简单 &lt;title&gt;JQuery 年月日三下拉框联动 &lt;script src="jquery-1.4.2.min.js" type="text/javascript"&gt; ...

    jquery 三级联动下拉框

    jquery 三级联动下拉框jquery 三级联动下拉框jquery 三级联动下拉框jquery 三级联动下拉框jquery 三级联动下拉框jquery 三级联动下拉框

    jQuery-searchableSelect带搜索功能的下拉选

    1. **js加载后select未刷新**:当使用jQuery-searchableSelect插件后,如果发现下拉框没有更新,可能是由于jQuery库未正确加载,或者插件的初始化代码执行时机不恰当。确保jQuery库在插件代码之前加载,并在DOM元素...

    jQuery实现带搜索功能的下拉框

    在jQuery库的支持下,实现这种“带搜索功能的下拉框”变得非常简单。这里我们将深入探讨`searchableSelect`插件,它是jQuery的一个扩展,专门用于创建具有搜索功能的下拉框。 `jQuery searchableSelect` 插件提供了...

    jQuery多选下拉框插件

    **jQuery多选下拉框插件详解** 在Web开发中,多选下拉框是一种常见的交互元素,它允许用户在一组选项中选择多个值。jQuery作为最流行的JavaScript库之一,提供了许多插件来增强这种用户体验。`jquery.multi-select....

    jquery动态创建联动下拉框

    本主题将深入探讨如何使用jQuery动态创建联动下拉框,这是一个常见的需求,特别是在构建多级选择或依赖性选择菜单时。 联动下拉框通常指的是两个或多个下拉框之间存在关联关系,当用户在一个下拉框中选择一个选项时...

    jQuery实现下拉框多选 jquery-multiselect 的实例代码

    以下是根据给出的文件内容,详细解释关于如何使用jquery-multiselect插件来实现下拉框多选功能的知识点。 首先,需要了解的是,实现下拉框多选功能,可以使用HTML原生的`&lt;select multiple="multiple"&gt;`标签,但这种...

    下拉框代码 下拉框特效 jquery下拉框代码

    &lt;script type="text/javascript" src="../../../jquery/jquery-1.7.1.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="jquery-ui.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="jquery.multiselect....

    jquery.jqGrid-4.3.0+jquery-ui-1.8.16.custom所有包

    《jQuery.jqGrid 4.3.0与jQuery UI 1.8.16自定义版全面解析》 在IT领域,jQuery是一个广泛使用的JavaScript库,它极大地简化了DOM操作、事件处理、动画以及Ajax交互。jQuery.jqGrid是基于jQuery的开源数据网格插件...

    可编辑的select下拉框

    `jQuery Editable Select`就是这样一个插件,它允许用户在下拉框中直接编辑输入,同时根据输入的内容实时过滤选项,提高了用户在大量数据中的查找效率。 `jQuery Editable Select`插件的工作原理是将标准的`...

    Jquery实现下拉框、多级联动

    总的来说,使用jQuery实现多级联动下拉框涉及到了HTML结构设计、CSS样式定制和JavaScript交互编程。开发者需要理解DOM操作、事件处理和数据通信的基本原理,同时也需具备一定的前端UI设计能力,才能创造出既实用又...

    jquery-easyui-1.5.3

    《jQuery EasyUI 1.5.3:打造高效前端界面的利器》 jQuery EasyUI 是一个基于 jQuery 的轻量级框架,它为开发者提供了一系列组件,使得构建交互式、响应式的Web界面变得更加简单。EasyUI 提供了丰富的UI组件,如...

    jQuery--省市区联动插件

    这种插件通常基于JavaScript库jQuery构建,能够实现省份、城市、区县三级选择的联动效果,即当用户选择一个省份时,相关的城市会自动加载,接着选择城市后,对应的区县也会动态显示。这样的设计不仅提高了用户体验,...

    jquery-easyui-1.4.2.zip

    《jQuery EasyUI 1.4.2:构建高效后台管理系统的基石》 jQuery EasyUI 是一个基于 jQuery 的轻量级前端框架,它为开发者提供了一系列易于使用的组件,以简化网页应用的开发工作。在给定的压缩包文件 "jquery-easyui...

    jQuery插件---mcdropdow.(仿下拉框多层次)

    jQuery插件---mcdropdow.(仿下拉框多层次)jQuery插件---mcdropdow.(仿下拉框多层次)jQuery插件---mcdropdow.(仿下拉框多层次)jQuery插件---mcdropdow.(仿下拉框多层次)jQuery插件---mcdropdow.(仿下拉框多层次)

Global site tag (gtag.js) - Google Analytics