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 相关文章推荐
使用node+vue.js实现SPA应用
Jan 28 Javascript
JS实现JSON.stringify的实例代码讲解
Feb 07 Javascript
微信小程序 检查接口状态实例详解
Jun 23 Javascript
JavaScript阻止表单提交方法(附代码)
Aug 15 Javascript
Vue中封装input组件的实例详解
Oct 17 Javascript
vue watch普通监听和深度监听实例详解(数组和对象)
Aug 16 Javascript
ndm:NPM的桌面GUI应用程序
Oct 15 Javascript
JS实现的tab页切换效果完整示例
Dec 18 Javascript
Vue 利用指令实现禁止反复发送请求的两种方法
Sep 15 Javascript
vue打开其他项目页面并传入数据详解
Nov 25 Vue.js
idea编译器vue缩进报错问题场景分析
Jul 04 Vue.js
什么是SOLID
Mar 24 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
thinkphp3.0 模板中函数的使用
2012/11/13 PHP
php去除换行符的方法小结(PHP_EOL变量的使用)
2013/02/16 PHP
php生成动态验证码gif图片
2015/10/19 PHP
php实现的统计字数函数定义与使用示例
2017/07/26 PHP
通用JS事件写法实现代码
2009/01/07 Javascript
同时使用n个window onload加载实例介绍
2013/04/25 Javascript
js清理Word格式示例代码
2014/02/13 Javascript
测试IE浏览器对JavaScript的AngularJS的兼容性
2015/06/19 Javascript
浏览器兼容性问题大汇总
2015/12/17 Javascript
JavaScript基础知识及常用方法总结
2016/01/10 Javascript
原生javascript实现图片无缝滚动效果
2016/02/12 Javascript
vue实现验证码输入框组件
2017/12/14 Javascript
angular项目中bootstrap-datetimepicker时间插件的使用示例
2018/03/15 Javascript
jQuery中常用动画效果函数知识点整理
2018/08/19 jQuery
小程序scroll-view组件实现滚动的示例代码
2018/09/20 Javascript
解决layer图标icon不加载的问题
2019/09/04 Javascript
node crawler如何添加promise支持
2020/02/01 Javascript
vue 如何从单页应用改造成多页应用
2020/10/23 Javascript
[00:59]DOTA2荣耀之路1:Doom is back!weapon X!
2018/05/22 DOTA
Python 字符串定义
2009/09/25 Python
python清除字符串里非数字字符的方法
2015/07/02 Python
一篇文章了解Python中常见的序列化操作
2019/06/20 Python
pytorch .detach() .detach_() 和 .data用于切断反向传播的实现
2019/12/27 Python
Html5+JS实现手机摇一摇功能
2015/04/24 HTML / CSS
Html5页面点击遮罩层背景关闭遮罩层
2020/11/30 HTML / CSS
法拉利英国精品店:Ferraris Boutique UK
2019/07/20 全球购物
俄罗斯最大的隐形眼镜销售网站:Ochkov.Net
2021/02/07 全球购物
美国最大和最受信任的二手轮胎商店:Bestusedtires.com
2020/06/02 全球购物
药剂学专业应届生自荐信
2013/09/29 职场文书
高中军训感言200字
2014/02/23 职场文书
户外活动总结范文
2014/04/30 职场文书
ktv好的活动方案
2014/08/15 职场文书
纪念九一八事变83周年国旗下讲话稿
2014/09/15 职场文书
公司管理建议书
2015/09/14 职场文书
2016年秋季运动会通讯稿
2015/11/25 职场文书
《语言的突破》读后感3篇
2019/12/12 职场文书