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 相关文章推荐
JS 密码强度验证(兼容IE,火狐,谷歌)
Mar 15 Javascript
Knockout数组(observable)使用详解示例
Nov 15 Javascript
JS的document.all函数使用示例
Dec 30 Javascript
jQuery 顶部导航跟随滚动条滚动固定浮动在顶部
Jun 06 Javascript
jQuery中unwrap()方法用法实例
Jan 16 Javascript
JavaScript表单焦点自动切换代码
Jul 24 Javascript
jQuery插件echarts实现的循环生成图效果示例【附demo源码下载】
Mar 04 Javascript
JavaScript数组去重的多种方法(四种)
Sep 19 Javascript
JS计算输出100元钱买100只鸡问题的解决方法
Jan 04 Javascript
浅谈React Native Flexbox布局(小结)
Jan 08 Javascript
微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
Jan 22 Javascript
基于jquery ajax的多文件上传进度条过程解析
Sep 11 jQuery
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
PHP中最容易忘记的一些知识点总结
2013/04/28 PHP
PHP中require和include路径问题详解
2014/12/25 PHP
Laravel 5框架学习之数据库迁移(Migrations)
2015/04/08 PHP
ThinkPHP 整合Bootstrap Ajax分页样式
2016/12/23 PHP
PHP 扩展Memcached命令用法实例总结
2020/06/04 PHP
jQuery表格插件ParamQuery简单使用方法示例
2013/12/05 Javascript
Jquery+asp.net后台数据传到前台js进行解析的方法
2014/05/11 Javascript
js漂浮广告实现代码
2015/08/15 Javascript
jQuery EasyUI Accordion可伸缩面板组件使用详解
2017/02/28 Javascript
SVG动画vivus.js库使用小结(实例代码)
2017/09/14 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
2018/03/05 Javascript
vue自定义指令的创建和使用方法实例分析
2018/12/04 Javascript
react 组件传值的三种方法
2019/06/03 Javascript
使用axios请求时,发送formData请求的示例
2019/10/29 Javascript
vue 解决form表单提交但不跳转页面的问题
2019/10/30 Javascript
Vue中常用rules校验规则(实例代码)
2019/11/14 Javascript
ES6 proxy和reflect的使用方法与应用实例分析
2020/02/15 Javascript
python批量下载图片的三种方法
2013/04/22 Python
在Python中使用正则表达式的方法
2015/08/13 Python
使用简单工厂模式来进行Python的设计模式编程
2016/03/01 Python
Python+MongoDB自增键值的简单实现
2016/11/04 Python
Flask框架web开发之零基础入门
2018/12/10 Python
对python字典过滤条件的实例详解
2019/01/22 Python
详解CSS3的perspective属性设置3D变换距离的方法
2016/05/23 HTML / CSS
canvas如何绘制钟表的方法
2017/12/13 HTML / CSS
美国学校校服,儿童和婴儿服装:Cookie’s Kids
2016/10/14 全球购物
KIKO MILANO西班牙官网:意大利领先的化妆品和护肤品品牌
2019/05/03 全球购物
优秀求职信范文分享
2014/01/26 职场文书
服装行业创业计划书范文
2014/02/05 职场文书
行政求职信
2014/07/04 职场文书
名人演讲稿范文
2014/09/16 职场文书
中标通知书格式
2015/04/17 职场文书
雾霾停课通知
2015/04/24 职场文书
个人借条范本
2015/05/25 职场文书
旷工检讨书大全
2015/08/15 职场文书
教您:房贷工资收入证明应该怎么写?
2019/08/19 职场文书