JQuery 操作select标签实现代码


Posted in Javascript onMay 14, 2010

下面几个常用的代码或许对您有帮助:

//1.获取选中option值 
$('#selectList').val(); 
//2.获取选中option的文本 
$('#selectList :selected').text(); 
//3.获取多个选中option值、文本 
var foo = []; 
$('#multiple :selected').each(function(i, selected) { 
foo[i] = $(selected).text(); 
}); 
// to get the selected values, just use .val() - this returns a string or array 
foo = $('#multiple :selected').val(); 
//4.使用选项option的条件表达式 
switch ($('#selectList :selected').text()) { 
case 'First Option': 
//do something 
break; 
case 'Something Else': 
// do something else 
break; 
} 
//5.删除某个value=2的option 
$("#selectList option[value='2']").remove(); 
//6.从list A 移动option到 list B. 
// here we have 2 select lists and 2 buttons. If you click the “add” button, 
// we remove the selected option from select1 and add that same option to select2. 
// The “remove” button just does things the opposite way around. 
// Thanks to jQuery's chaining capabilities, what was once a rather tricky undertaking with JS can now be done in 6 lines of code. 
$().ready(function() { 
$('#add').click(function() { 
return !$('#select1 option:selected').appendTo('#select2'); 
}); 
$('#remove').click(function() { 
return !$('#select2 option:selected').appendTo('#select1'); 
}); 
});

如果您不了解JQuery,可以先看它的文档。

希望这篇POST对您有帮助。

Javascript 相关文章推荐
JS面向对象编程之对象使用分析
Aug 19 Javascript
jQuery之按钮组件的深入解析
Jun 19 Javascript
JS+CSS实现大气的黑色首页导航菜单效果代码
Sep 10 Javascript
基于JavaScript实现div层跟随滚动条滑动
Jan 12 Javascript
全面解析JavaScript里的循环方法之forEach,for-in,for-of
Apr 20 Javascript
JS查找字符串中出现最多的字符及个数统计
Feb 04 Javascript
EasyUI为Numberbox添加blur事件的方法
Mar 05 Javascript
vue axios封装及API统一管理的方法
Apr 18 Javascript
VUE解决 v-html不能触发点击事件的问题
Oct 28 Javascript
JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法
Apr 13 Javascript
解决ant-design-vue中menu菜单无法默认展开的问题
Oct 31 Javascript
微信小程序实现拍照和相册选取图片
May 09 Javascript
高性能web开发 如何加载JS,JS应该放在什么位置?
May 14 #Javascript
js 图片等比例缩放代码
May 13 #Javascript
跨浏览器开发经验总结(四) 怎么写入剪贴板
May 13 #Javascript
跨浏览器开发经验总结(三)   警惕“IE依赖综合症”
May 13 #Javascript
JavaScript prototype属性使用说明
May 13 #Javascript
js 实现复制到粘贴板的功能代码
May 13 #Javascript
js href的用法
May 13 #Javascript
You might like
dede3.1分页文字采集过滤规则详说(图文教程)续四
2007/04/03 PHP
基于php验证码函数的使用示例
2013/05/03 PHP
如何用php获取文件名后缀
2013/06/09 PHP
分享一个超好用的php header下载函数
2014/01/31 PHP
PHP引用(&)各种使用方法实例详解
2014/03/20 PHP
PHP自动重命名文件实现方法
2014/11/04 PHP
Apache连接PHP后无法启动问题解决思路
2015/06/18 PHP
PHP 设计模式系列之 specification规格模式
2016/01/10 PHP
如何让动态插入的javascript脚本代码跑起来。
2007/01/09 Javascript
JavaScript 学习笔记(十二) dom
2010/01/21 Javascript
js网页侧边随页面滚动广告效果实现
2011/04/14 Javascript
关于JavaScript的with 语句的使用方法
2011/05/09 Javascript
33个优秀的 jQuery 图片展示插件分享
2012/03/14 Javascript
js使用心得分享
2015/01/13 Javascript
2则自己编写的jQuery特效分享
2015/02/26 Javascript
在Node.js应用中使用Redis的方法简介
2015/06/24 Javascript
深入理解JS DOM事件机制
2016/08/06 Javascript
jQuery实现的表格展开伸缩效果实例
2016/09/07 Javascript
node.js实现登录注册页面
2017/04/08 Javascript
mui 打开新窗口的方式总结及注意事项
2017/08/20 Javascript
详解javascript 正则表达式之分组与前瞻匹配
2018/05/30 Javascript
vue+node实现图片上传及预览的示例方法
2018/11/22 Javascript
js实现简易计算器功能
2019/10/18 Javascript
使用Vue Composition API写出清晰、可扩展的表单实现
2020/06/10 Javascript
antd Form组件方法getFieldsValue获取自定义组件的值操作
2020/10/29 Javascript
[01:06]DOTA2小知识课堂 Ep.01 TP出门不要忘记帮队友灌瓶哦
2019/12/05 DOTA
详解Python中 sys.argv[]的用法简明解释
2017/12/20 Python
python的常用模块之collections模块详解
2018/12/06 Python
python简单区块链模拟详解
2019/07/03 Python
使用Python实现文字转语音并生成wav文件的例子
2019/08/08 Python
python实现ftp文件传输功能
2020/03/20 Python
python中append函数用法讲解
2020/12/11 Python
详解基于canvas的视频遮罩插件
2018/01/04 HTML / CSS
上课睡觉万能检讨书
2015/02/17 职场文书
解决golang 关于全局变量的坑
2021/05/06 Golang
python 定义函数 返回值只取其中一个的实现
2021/05/21 Python