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 相关文章推荐
javascript游戏开发之《三国志曹操传》零部件开发(一)让静态人物动起来
Jan 23 Javascript
如何解决Jquery库及其他库之间的$命名冲突
Sep 15 Javascript
js简单实现删除记录时的提示效果
Dec 05 Javascript
jQuery应用之jQuery链用法实例
Jan 19 Javascript
JS原型与原型链的深入理解
Feb 15 Javascript
Ionic + Angular.js实现图片轮播的方法示例
May 21 Javascript
基于jQuery对象和DOM对象和字符串之间的转化实例
Aug 08 jQuery
Vue组件选项props实例详解
Aug 18 Javascript
JS实现div模块的截图并下载功能
Oct 17 Javascript
浅谈如何优雅处理JavaScript异步错误
Nov 12 Javascript
修改vue源码实现动态路由缓存的方法
Jan 21 Javascript
JSONObject与JSONArray使用方法解析
Sep 28 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
PHP使用Redis实现防止大并发下二次写入的方法
2017/10/09 PHP
php多进程应用场景实例详解
2019/07/22 PHP
Thinkphp 框架扩展之类库扩展操作详解
2020/04/23 PHP
新手入门常用代码集锦
2007/01/11 Javascript
Locate a File Using a File Open Dialog Box
2007/06/18 Javascript
JavaScript Ajax Json实现上下级下拉框联动效果实例代码
2013/11/23 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
微信小程序-拍照或选择图片并上传文件
2017/01/06 Javascript
微信小程序实现顶部选项卡(swiper)
2020/06/19 Javascript
解决vue组件中使用v-for出现告警问题及v for指令介绍
2017/11/11 Javascript
微信小程序swiper组件用法实例分析【附源码下载】
2017/12/07 Javascript
使用JavaScript实现node.js中的path.join方法
2018/08/12 Javascript
Vue自定义弹窗指令的实现代码
2018/08/13 Javascript
每个 JavaScript 工程师都应懂的33个概念
2018/10/22 Javascript
微信小程序中button去除默认的边框实例代码
2019/08/01 Javascript
react中hook介绍以及使用教程
2020/12/11 Javascript
[34:39]DOTA2上海特级锦标赛主赛事日 - 4 败者组第四轮#1COL VS EG第二局
2016/03/05 DOTA
python实现的一个火车票转让信息采集器
2014/07/09 Python
轻松掌握python设计模式之策略模式
2016/11/18 Python
Python 专题四 文件基础知识
2017/03/20 Python
Python OpenCV实现图片上输出中文
2018/01/22 Python
python多线程并发实例及其优化
2019/06/27 Python
python3实现的zip格式压缩文件夹操作示例
2019/08/17 Python
Django实现文件上传下载
2019/10/06 Python
python GUI库图形界面开发之PyQt5图片显示控件QPixmap详细使用方法与实例
2020/02/27 Python
CSS3中animation实现流光按钮效果
2020/12/21 HTML / CSS
Clarins娇韵诗美国官网:法国天然护肤品牌
2016/09/26 全球购物
Mountain Warehouse波兰官方网站:英国户外品牌
2019/08/29 全球购物
Python文件操作的面试题
2013/06/22 面试题
客房主管岗位职责
2013/12/09 职场文书
最新党员思想汇报
2014/01/01 职场文书
毕业生自荐书模版
2014/01/04 职场文书
迟到检讨书5000字
2014/01/31 职场文书
主题婚礼策划方案
2014/02/10 职场文书
合作协议书范文
2014/08/20 职场文书
高中教师个人总结
2015/02/10 职场文书