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 22 Javascript
使用隐藏的new来创建对象
Mar 29 Javascript
潜说js对象和数组
May 25 Javascript
JS滚轮事件onmousewheel使用介绍
Nov 01 Javascript
深入分析js的冒泡事件
Dec 05 Javascript
基于Bootstrap的后台管理面板 Bootstrap Metro Dashboard
Jun 17 Javascript
详细总结Javascript中的焦点管理
Sep 17 Javascript
利用JQuery阻止事件冒泡
Dec 01 Javascript
javascript实现页面滚屏效果
Jan 17 Javascript
vue修改vue项目运行端口号的方法
Aug 04 Javascript
手把手带你封装一个vue component第三方库
Feb 14 Javascript
简单了解vue.js数组的常用操作
Jun 17 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中curl和file_get_content的区别
2014/05/10 PHP
神盾加密解密教程(二)PHP 神盾解密
2014/06/08 PHP
如何让搜索引擎抓取AJAX内容解决方案
2014/08/25 PHP
浅析php设计模式之数据对象映射模式
2016/03/03 PHP
PHP定义字符串的四种方式详解
2018/02/06 PHP
ThinkPHP5框架中使用JWT的方法示例
2020/06/03 PHP
Mootools 1.2教程 正则表达式
2009/09/15 Javascript
ExtJS实现文件下载的方法实例
2013/11/09 Javascript
Javascript学习笔记之 对象篇(一) : 对象的使用和属性
2014/06/24 Javascript
Jquery树插件zTree用法入门教程
2015/02/17 Javascript
基于jQuery实现拖拽图标到回收站并删除功能
2015/11/25 Javascript
javascript实现获取图片大小及图片等比缩放的方法
2016/11/24 Javascript
JS实现列表页面隔行变色效果
2017/03/25 Javascript
浅谈Angular2 ng-content 指令在组件中嵌入内容
2017/08/18 Javascript
微信网页登录逻辑与实现方法
2019/04/29 Javascript
微信小程序实现pdf、word等格式文件上传的方法
2019/09/10 Javascript
微信小程序绑定手机号获取验证码功能
2019/10/22 Javascript
vue中watch和computed的区别与使用方法
2020/08/23 Javascript
[02:45]DOTA2英雄基础教程 伐木机
2013/12/23 DOTA
简明 Python 基础学习教程
2007/02/08 Python
Python抽象和自定义类定义与用法示例
2018/08/23 Python
selenium+python自动化测试之环境搭建
2019/01/23 Python
Python中的元组介绍
2019/01/28 Python
Python占用的内存优化教程
2019/07/28 Python
python 多维高斯分布数据生成方式
2019/12/09 Python
css3 中实现炫酷的loading效果
2019/04/26 HTML / CSS
一款纯css3实现的动画加载导航
2014/10/08 HTML / CSS
学生宿舍管理制度
2014/01/30 职场文书
机械系毕业生求职信
2014/05/28 职场文书
副总经理岗位职责
2015/02/02 职场文书
毕业生党员个人总结
2015/02/14 职场文书
幼儿园中班教育随笔
2015/08/14 职场文书
python 实现定时任务的四种方式
2021/04/01 Python
上帝为你开了一扇窗之Tkinter常用函数详解
2021/06/02 Python
关于Redis的主从复制及哨兵问题
2022/06/16 Redis
CSS中使用grid布局实现一套模板多种布局
2022/07/15 HTML / CSS