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 相关文章推荐
jQuery为iframe的body添加click事件的实现代码
Apr 07 Javascript
jquery调用asp.net 页面后台的实现代码
Apr 27 Javascript
前端弹出对话框 js实现ajax交互
Sep 09 Javascript
浅谈JavaScript正则表达式-非捕获性分组
Mar 08 Javascript
利用Node.js检测端口是否被占用的方法
Dec 07 Javascript
jQuery实现table表格信息的展开和缩小功能示例
Jul 21 jQuery
js代码规范之Eslint安装与配置详解
Sep 08 Javascript
vue-quill-editor+plupload富文本编辑器实例详解
Oct 19 Javascript
使用vue2实现带地区编号和名称的省市县三级联动效果
Nov 05 Javascript
使用Vue实现移动端左滑删除效果附源码
May 16 Javascript
基于jquery ajax的多文件上传进度条过程解析
Sep 11 jQuery
VUE UPLOAD 通过ACTION返回上传结果操作
Sep 07 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
我的论坛源代码(五)
2006/10/09 PHP
PHP 程序员也要学会使用“异常”
2009/06/16 PHP
thinkPHP商城公告功能开发问题分析
2016/12/01 PHP
javascript 避免闭包引发的问题
2009/03/17 Javascript
Mootools 1.2教程 同时进行多个形变动画
2009/09/15 Javascript
js解析与序列化json数据(二)序列化探讨
2013/02/01 Javascript
使用JavaScript的ActiveXObject对象检测应用程序是否安装的方法
2014/04/15 Javascript
zeroclipboard 单个复制按钮和多个复制按钮的实现方法
2014/06/14 Javascript
javascript查询字符串参数的方法
2015/01/28 Javascript
JavaScript对象数组的排序处理方法
2015/10/21 Javascript
基于JavaScript实现回到页面顶部动画代码
2016/05/24 Javascript
详解js的六大数据类型
2016/12/27 Javascript
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
2017/03/28 jQuery
认识jQuery的Promise的具体使用方法
2017/10/10 jQuery
JavaScript防止全局变量污染的方法总结
2018/08/02 Javascript
vue项目中axios请求网络接口封装的示例代码
2018/12/18 Javascript
小程序中this.setData的使用和注意事项
2019/08/28 Javascript
jQuery/JS监听input输入框值变化实例
2019/10/17 jQuery
node省市区三级数据性能测评实例分析
2019/11/06 Javascript
python解决字典中的值是列表问题的方法
2013/03/04 Python
Python实现平行坐标图的两种方法小结
2019/07/04 Python
一行python实现树形结构的方法
2019/08/09 Python
Python类中的装饰器在当前类中的声明与调用详解
2020/04/15 Python
python随机模块random的22种函数(小结)
2020/05/15 Python
Python是什么 Python的用处
2020/05/26 Python
学python需要去培训机构吗
2020/07/01 Python
Python在字符串中处理html和xml的方法
2020/07/31 Python
python 获取域名到期时间的方法步骤
2021/02/10 Python
Zooplus葡萄牙:欧洲领先的网上宠物商店
2018/07/01 全球购物
精细化工应届生求职信
2013/11/17 职场文书
事务机电主管工作职责
2014/02/25 职场文书
酒店总经理职务说明书
2014/02/26 职场文书
工作检讨书大全
2015/01/26 职场文书
宇宙与人观后感
2015/06/05 职场文书
伊索寓言读书笔记
2015/06/30 职场文书
社区服务活动感想
2015/08/11 职场文书