JQuery select标签操作代码段


Posted in Javascript onMay 16, 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,可以先看它的文档。

Javascript 相关文章推荐
jQuery 动画基础教程
Dec 25 Javascript
8款非常棒的响应式jQuery 幻灯片插件推荐
Feb 02 Javascript
js AppendChild与insertBefore用法详细对比
Dec 16 Javascript
多引号嵌套的变量命名的问题
May 09 Javascript
基于Jquery easyui 选中特定的tab
Nov 17 Javascript
AngularJS 过滤器的简单实例
Jul 27 Javascript
Jqprint实现页面打印
Jan 06 Javascript
微信小程序 实现点击添加移除class
Jun 12 Javascript
使用vue-router设置每个页面的title方法
Feb 11 Javascript
玩转Koa之koa-router原理解析
Dec 29 Javascript
vue+element模态框中新增模态框和删除功能
Jun 11 Javascript
Element Alert警告的具体使用方法
Jul 27 Javascript
js数据验证集合、js email验证、js url验证、js长度验证、js数字验证等简单封装
May 15 #Javascript
Jquery 最近浏览过的商品的功能实现代码
May 14 #Javascript
WEB 浏览器兼容 推荐收藏
May 14 #Javascript
js 数值项目的格式化函数代码
May 14 #Javascript
IE8 中使用加速器(Activities)
May 14 #Javascript
jquery 日期分离成年月日的代码
May 14 #Javascript
JQuery 操作select标签实现代码
May 14 #Javascript
You might like
基于Snoopy的PHP近似完美获取网站编码的代码
2011/10/23 PHP
php导出csv格式数据并将数字转换成文本的思路以及代码分享
2014/06/05 PHP
ThinkPHP调用百度翻译类实现在线翻译
2014/06/26 PHP
thinkPHP+LayUI 流加载实现功能
2019/09/27 PHP
浅谈php常用的7大框架的优缺点
2020/07/20 PHP
jQuery 获取URL参数的插件
2010/03/04 Javascript
Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法
2013/08/08 Javascript
jquery中的过滤操作详细解析
2013/12/02 Javascript
js实现多选项切换导航菜单的方法
2015/02/06 Javascript
jQuery实现tab选项卡效果的方法
2015/07/08 Javascript
jquery实现简单的轮换出现效果实例
2015/07/23 Javascript
jfinal与bootstrap的登录跳转实战演习
2015/09/22 Javascript
封装的dialog插件 基于bootstrap模态对话框的简单扩展
2016/08/10 Javascript
深入理解requestAnimationFrame的动画循环
2016/09/20 Javascript
vue双向绑定的简单实现
2016/12/22 Javascript
从零开始学习Node.js系列教程二:文本提交与显示方法
2017/04/13 Javascript
bootstrap fileinput实现文件上传功能
2017/08/23 Javascript
jQuery实现可兼容IE6的滚动监听功能
2017/09/20 jQuery
分析JS单线程异步io回调的特性
2017/12/01 Javascript
详解在Vue中使用TypeScript的一些思考(实践)
2018/07/06 Javascript
小程序实现录音上传功能
2019/11/22 Javascript
JavaScript实现简单计算器
2020/03/19 Javascript
vue使用video插件vue-video-player的示例
2020/10/03 Javascript
python使用xlrd模块读写Excel文件的方法
2015/05/06 Python
Python用于学习重要算法的模块pygorithm实例浅析
2018/08/16 Python
python使用pdfminer解析pdf文件的方法示例
2018/12/20 Python
python2.7 安装pip的方法步骤(管用)
2019/05/05 Python
django 中QuerySet特性功能详解
2019/07/25 Python
澳大利亚购买太阳镜和眼镜网站:Glamoureyes
2020/09/22 全球购物
大学辅导员事迹材料
2014/02/05 职场文书
师范生自荐信模板
2014/05/28 职场文书
党员个人自我剖析材料
2014/10/08 职场文书
请病假条范文
2015/08/17 职场文书
2016元旦晚会主持人开场白和结束语
2015/12/03 职场文书
小学生节约用水倡议书
2019/08/12 职场文书
Python 中的 copy()和deepcopy()
2021/11/07 Python