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 相关文章推荐
Javascript加载速度慢的解决方案
Mar 11 Javascript
Javascript window对象详解
Nov 12 Javascript
js字符串截取函数slice、substring和substr的比较
May 17 Javascript
javascript insertAfter()定义与用法示例
Jul 25 Javascript
JavaScript中关于for循环删除数组元素内容时出现的问题
Nov 21 Javascript
微信小程序-详解数据缓存
Nov 24 Javascript
Angular2环境搭建具体操作步骤(推荐)
Aug 04 Javascript
jQuery实现列表的增加和删除功能
Jun 14 jQuery
使用Angular 6创建各种动画效果的方法
Oct 10 Javascript
vscode vue 文件模板的配置方法
Jul 23 Javascript
Vue路由前后端设计总结
Aug 06 Javascript
JS实现炫酷轮播图
Nov 15 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
PHP中一个控制字符串输出的函数
2006/10/09 PHP
PHP编程中八种常见的文件操作方式
2006/11/19 PHP
php 使用array函数实现分页
2015/02/13 PHP
CodeIgniter连贯操作的底层原理分析
2016/05/17 PHP
yii2.0整合阿里云oss上传单个文件的示例
2017/09/19 PHP
TNC vs RR BO3 第一场 2.14
2021/03/10 DOTA
firefox中用javascript实现鼠标位置的定位
2007/06/17 Javascript
Javascript 颜色渐变效果的实现代码
2013/10/01 Javascript
在js文件中写el表达式取不到值的原因及解决方法
2013/12/23 Javascript
JavaScript中的定时器之Item23的合理使用
2015/10/30 Javascript
jQuery实现漂亮实用的商品图片tips提示框效果(无图片箭头+阴影)
2016/04/16 Javascript
JavaScript 中有关数组对象的方法(详解)
2016/08/15 Javascript
AngularJS Toaster使用详解
2017/02/24 Javascript
JS简单实现自定义右键菜单实例
2017/05/31 Javascript
各种选择框jQuery的选中方法(实例讲解)
2017/06/27 jQuery
关于layui时间回显问题的解决方法
2019/09/24 Javascript
vue-property-decorator用法详解
2019/12/12 Javascript
OpenLayers加载缩放控件使用方法详解
2020/09/25 Javascript
JS中锚点链接点击平滑滚动并自由调整到顶部位置
2021/02/06 Javascript
[09:13]2014DOTA2国际邀请赛 中国区预选赛coser表演
2014/05/23 DOTA
[01:12:44]VG vs Mineski Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
[01:04]不如跳舞!DOTA2新英雄玛尔斯的欢乐日常
2019/03/11 DOTA
python实现在windows服务中新建进程的方法
2015/06/30 Python
Python列出一个文件夹及其子目录的所有文件
2016/06/30 Python
python 读写中文json的实例详解
2017/10/29 Python
python自动化生成IOS的图标
2018/11/13 Python
django认证系统 Authentication使用详解
2019/07/22 Python
Django框架HttpRequest对象用法实例分析
2019/11/01 Python
英国的潮牌鞋履服饰商店:size?
2019/03/26 全球购物
亚洲航空公司官方网站:AirAsia
2019/11/25 全球购物
技校个人求职信范文
2014/01/25 职场文书
甜品蛋糕店创业计划书范文
2014/02/06 职场文书
幼儿园教师演讲稿
2014/05/06 职场文书
社会主义核心价值观主题教育活动总结
2015/05/07 职场文书
2016关于读书活动的心得体会
2016/01/14 职场文书
MySQL 表空间碎片的概念及相关问题解决
2021/05/07 MySQL