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 相关文章推荐
硬盘浏览程序,保存成网页格式便可使用
Dec 03 Javascript
Mootools 1.2教程(3) 数组使用简介
Sep 14 Javascript
定义JavaScript二维数组采用定义数组的数组来实现
Dec 09 Javascript
jquery 触发a链接点击事件解决方案
May 02 Javascript
js淡入淡出的图片轮播效果代码分享
Aug 24 Javascript
原生JavaScript实现瀑布流布局
Jun 28 Javascript
简单谈谈ES6的六个小特性
Nov 18 Javascript
bootstrap vue.js实现tab效果
Feb 07 Javascript
Jquery获取radio选中的值
May 05 jQuery
JavaScript数组去重的多种方法(四种)
Sep 19 Javascript
angular6.0使用教程之父组件通过url传递id给子组件的方法
Jun 30 Javascript
js计算两个时间差 天 时 分 秒 毫秒的代码
May 21 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项目中比较通用的php自建函数的详解
2013/06/06 PHP
mac下Apache + MySql + PHP搭建网站开发环境
2014/06/02 PHP
PHP自定义函数实现数组比较功能示例
2017/10/19 PHP
详解php用static方法的原因
2018/09/12 PHP
指定js可访问其它域名的cookie的方法
2007/09/18 Javascript
JavaScript 对话框和状态栏使用说明
2009/10/25 Javascript
ExtJs中简单的登录界面制作方法
2010/08/19 Javascript
javascript陷阱 一不小心你就中招了(字符运算)
2013/11/10 Javascript
JavaScript实现删除,移动和复制文件的方法
2015/08/05 Javascript
简单对比分析JavaScript中的apply,call与this的使用
2015/12/04 Javascript
对js中回调函数的一些看法
2016/08/29 Javascript
JS简单实现父子窗口传值功能示例【未使用iframe框架】
2017/09/20 Javascript
angularjs select 赋值 ng-options配置方法
2018/02/28 Javascript
JavaScript创建对象方式总结【工厂模式、构造函数模式、原型模式等】
2018/12/19 Javascript
vue.js实现只能输入数字的输入框
2019/10/19 Javascript
Vuex,iView UI面包屑导航使用扩展详解
2019/11/04 Javascript
[59:48]DOTA2-DPC中国联赛 正赛 VG vs Magma BO3 第一场 1月26日
2021/03/11 DOTA
python实现同时给多个变量赋值的方法
2015/04/30 Python
Python批量创建迅雷任务及创建多个文件
2016/02/13 Python
python脚本监控docker容器
2016/04/27 Python
Python读取文件内容的三种常用方式及效率比较
2017/10/07 Python
python对于requests的封装方法详解
2019/01/03 Python
linux 下selenium chrome使用详解
2020/04/02 Python
Python3 socket即时通讯脚本实现代码实例(threading多线程)
2020/06/01 Python
Python利用Xpath选择器爬取京东网商品信息
2020/06/01 Python
CSS3——齿轮转动关键代码
2013/05/02 HTML / CSS
html5 canvas合成海报所遇问题及解决方案总结
2017/08/03 HTML / CSS
Liu Jo西班牙官网:意大利服装品牌
2019/09/11 全球购物
锐步英国官网:Reebok英国
2019/11/29 全球购物
通用C#笔试题附答案
2016/11/26 面试题
Linux文件系统类型
2012/09/16 面试题
播音主持专业个人自我评价
2014/01/09 职场文书
法人授权委托书范本
2014/04/04 职场文书
高中学校对照检查材料
2014/08/31 职场文书
2016年暑期教师培训心得体会
2016/01/09 职场文书
雄兵连:第三季先行图公开,天使恶魔联合,银河之力的新力量
2021/06/11 国漫