`
niuka
  • 浏览: 50821 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

jQselectable 挺不错的下拉框插件

阅读更多

    最近项目中使用到了一个挺不错的jquery插件,特意记录一下。总结一下,觉得优点有以下3点。1可以替代以往的二级联动,可以将3及联动改成二级联动。2可以丰富用户体验,相比之下,用户更加喜欢2简单一些的事情。

    效果如果!

   

   Html以及javascript代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<meta http-equiv="Content-Script-Type" content="text/javascript" />
	<title>jQselectable : make selectbox so useful</title>
	<link type="text/css" rel="stylesheet" href="css/style.css" />
	<link type="text/css" rel="stylesheet" href="skin/selectable/style.css" />
	<script type="text/javascript" src="http://www.google.com/jsapi"></script>
	<script type="text/javascript">google.load("jquery", "1.3.2");</script>
	<script type="text/javascript" src="js/jQselectable.js"></script>
	<script type="text/javascript">
	jQuery(function($){

	$("#pref").jQselectable({
			set: "fadeIn",
			setDuration: "fast",
			opacity: .9
		});
	});
	</script>
</head>

<body>

<div class="pagebody">
	<h1>jQselectable</h1>
	<p id="skin">change styles:<a href="#selectable">selectable</a> | <a href="#natural">natural</a></p>
	<h2>Default selectbox</h2>
	<dl id="noapply">
	    <dt><label for="pref_noapply">1) Default selectbox</label></dt>
	    <dd>
	    	<select id="pref_noapply" name="pref_noapply" class="">
	    		<optgroup label="上海">
	    			<option value="01">徐汇</option>
					<option value="01">浦东新区</option>
	    		</optgroup>
	    		<optgroup label="湖南">
	    			<option value="02">吉首</option>
	    			<option value="03">长沙</option>	
	    			<option value="04">湘潭</option>
	    			<option value="05">浏阳</option>
	    		</optgroup>
	    	</select>
	    </dd>
	</dl>
	
	<h2>jQselectable</h2>
	<dl id="selectable">
	    <dt><label for="pref">2) Prefectures with optgroup not using selected, <strong>selectable</strong></label></dt>
	    <dd>
	    	<select id="pref" name="pref" class="selectable">
	    		<optgroup label="上海">
	    			<option value="01">徐汇</option>
					<option value="01">浦东新区</option>
	    		</optgroup>
	    		<optgroup label="湖南">
	    			<option value="02">吉首</option>
	    			<option value="03">长沙</option>	
	    			<option value="04">湘潭</option>
	    			<option value="05">浏阳</option>
	    		</optgroup>
	    	</select>
	    </dd>
	   
	  
	    
</div>

</body>
</html>

 

分享到:
评论

相关推荐

    jQuery下拉列表select美化插件jQselectable

    jQuery下拉列表select美化插件jQselectable jQuery下拉列表select美化插件jQselectable jQuery下拉列表select美化插件jQselectable jQuery下拉列表select美化插件jQselectable

    jQuery下拉列表插件 jQselectable

    jQselectable 是一个日本人开发的 jQuery 插件,用来实现多种下拉列表控制的样式

    jQuery下拉列表插件jQselectable.zip

    jQuery下拉列表插件jQselectable是一款用来实现多种下拉列表控制的样式,支持多列显示和透明效果。

    jqselectable_个人修改版

    基于jqselectable的微小修改,主要是样式的命名和定义。

    企业数字化转型暨数据仓库(数仓)建设方案.pptx

    企业数字化转型暨数据仓库(数仓)建设方案.pptx

    2024年中国LED切割灯行业研究报告.docx

    2024年中国LED切割灯行业研究报告

    目前世界上最好的机器学习&深度学习&神经网络&图神经网络&卷积网络&多层感知机画图工具&基于PPT

    在当今快速发展的人工智能领域中,一款集成了机器学习、深度学习、神经网络、图神经网络、卷积网络及多层感知机可视化功能的画图工具脱颖而出,成为全球范围内最受欢迎和认可的工具之一。这款工具不仅仅是一个简单的绘图软件,它的设计初衷是为了让复杂的网络结构和算法直观化,从而帮助研究者、学者及开发人员更容易地理解和分享他们的工作。 最令人印象深刻的特色之一是它基于PPT的编辑能力,这允许用户在熟悉的PPT编辑环境中创建、编辑和展示复杂的网络结构。用户可以利用拖拉组件、调整尺寸、修改颜色和形状等功能,无缝地将科研成果或项目展示集成到演示文稿中,极大地提高了工作的效率和表现力。 该工具不仅支持广泛的网络结构和模型,还包含丰富的库和模块,让用户能够轻松自定义和扩展自己的模型。它的用户界面友好、直观,无论是机器学习的新手还是资深研究员,都能快速上手,将精力更多地集中在创新和研究上,而不是图形的绘制和编辑上。 此外,它强大的共享和合作功能,使得团队成员可以实时共享他们的成果,促进了知识的交流和项目的进展。这款工具不仅改善了人工智能领域内部的工作方式,也为更广泛的受众提供了学习和理解复杂算法的窗口。 总

    2024年中国B型超声诊断设备行业研究报告.docx

    2024年中国B型超声诊断设备行业研究报告

    node-v11.0.0-linux-armv7l.tar.xz

    Node.js,简称Node,是一个开源且跨平台的JavaScript运行时环境,它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立,旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎,可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型,这使得它非常适合处理大量并发连接,从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外,Node.js使用了模块化的架构,通过npm(Node package manager,Node包管理器),社区成员可以共享和复用代码,极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展,它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等,因此,开发者可以用JavaScript编写全栈应用程序,这一点大大提高了开发效率和便捷性。 在实践中,许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台,如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能,简化了开发流程,并且能更快地响应市场需求。

    node-v10.8.0-darwin-x64.tar.xz

    Node.js,简称Node,是一个开源且跨平台的JavaScript运行时环境,它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立,旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎,可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型,这使得它非常适合处理大量并发连接,从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外,Node.js使用了模块化的架构,通过npm(Node package manager,Node包管理器),社区成员可以共享和复用代码,极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展,它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等,因此,开发者可以用JavaScript编写全栈应用程序,这一点大大提高了开发效率和便捷性。 在实践中,许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台,如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能,简化了开发流程,并且能更快地响应市场需求。

    web javaScript 获取终端ip 获取本地ip 获取本机ip地址,403报错解决方案

    内容概要:通过带着读者手写简化版 ajax请求框架,了解网络请求核心原理。在手写ajax的过程中会摘取整体框架中的核心逻辑,简化代码实现过程,保留核心功能,例如:XMLHttpRequest、jsonp请求、作用域、资源处理等内容实现。 适用人群:具备一定编程基础,工作1-3年的大前端开发、网络安全的研发人员 适用场景:金融支付、设备识别、IP 限制、网络监控、技术测试 能学到什么:手写ajax请求、兼容jsonp请求、动态添加meta标签、动态获取本地ip、处理403网络请求报错。 阅读建议:可以在以下框架中使用:react、react-native、vue、javaScript、web、jquery框架。在webapp工程,获取终端ip 获取本地ip 获取本机ip地址,403报错解决方案。

    node-v4.4.6-x64.msi

    Node.js,简称Node,是一个开源且跨平台的JavaScript运行时环境,它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立,旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎,可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型,这使得它非常适合处理大量并发连接,从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外,Node.js使用了模块化的架构,通过npm(Node package manager,Node包管理器),社区成员可以共享和复用代码,极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展,它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等,因此,开发者可以用JavaScript编写全栈应用程序,这一点大大提高了开发效率和便捷性。 在实践中,许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台,如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能,简化了开发流程,并且能更快地响应市场需求。

    Stm32学习笔记,超详细.txt

    Stm32学习笔记,超详细

    halcon 3D图像重建

    halcon 3D图像重建。

    node-v8.16.2-linux-armv6l.tar.xz

    Node.js,简称Node,是一个开源且跨平台的JavaScript运行时环境,它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立,旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎,可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型,这使得它非常适合处理大量并发连接,从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外,Node.js使用了模块化的架构,通过npm(Node package manager,Node包管理器),社区成员可以共享和复用代码,极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展,它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等,因此,开发者可以用JavaScript编写全栈应用程序,这一点大大提高了开发效率和便捷性。 在实践中,许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台,如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能,简化了开发流程,并且能更快地响应市场需求。

    虚拟网卡库,Python或者C都可以调用

    虚拟网卡库,Python或者C都可以调用,虚拟网卡

    IEC 60364-7-721-2017 低压电气装置.第7-721部分:特殊装置或场所的要求.房车和机动房车中的电气装置.

    IEC 60364-7-721-2017 低压电气装置.第7-721部分:特殊装置或场所的要求.房车和机动房车中的电气装置.pdf

    BS 1363-1-2023 :13A插头、插座、适配器和连接装置第1部分:可重新布线和不可重新布线的13A保险丝插头规范

    BS 1363-1-2023 :13A插头、插座、适配器和连接装置第1部分:可重新布线和不可重新布线的13A保险丝插头规范.pdf

    平安业研一体 BizDevOps—降本增效与业务价值最大化实践-龚明杰.pdf

    平安业研一体 BizDevOps—降本增效与业务价值最大化实践-龚明杰

    2021年美赛A~F题36篇特等奖论文合集.pdf

    大学生,数学建模,美国大学生数学建模竞赛,MCM/ICM,历年美赛特等奖O奖论文

Global site tag (gtag.js) - Google Analytics