jquery操作select option 的代码小结


Posted in Javascript onJune 21, 2011

1、获取选中select的value和text,html代码如下:

<select id="mySelect"> 
<option value="1">one</option> 
<option value="2">two</option> 
<option value="3">three</option> 
</select>

则可通过以下script代码s来获取选中的value和text
$("#mySelect").val(); //获取选中记录的value值 
$("#mySelect option:selected").text(); //获取选中记录的text值

2、运用new Option("文本","值")方法添加选项option
var obj = document.getElementById("mySelect"); 
obj.add(new Option("4","4"));

3、删除所有选项option
var obj = document.getElementById("mySelect"); 
obj.options.length = 0;

4、删除选中选项option
var obj = document.getElementById("mySelect"); 
var index = obj.selectedIndex; 
obj.options.remove(index);

5、修改选中选项option
var obj = document.getElementById("mySelect"); 
var index = obj.selectedIndex; 
obj.options[index] = new Option("three",3); //更改对应的值 
obj.options[index].selected = true; //保持选中状态

6、删除select
var obj = document.getElementById("mySelect"); 
obj.parentNode.removeChild(obj); //移除当前对象

7、select选择的响应事件
$("#mySelect").change(function(){ 
//添加所需要执行的操作代码 
})
Javascript 相关文章推荐
javascript判断单选框或复选框是否选中方法集锦
Apr 04 Javascript
JS修改css样式style浅谈
May 06 Javascript
JavaScript对象属性检查、增加、删除、访问操作实例
Jul 08 Javascript
jQuery实现form表单元素序列化为json对象的方法
Dec 09 Javascript
JavaScript 数组some()和filter()的用法及区别
May 20 Javascript
JS实现n秒后自动跳转的两种方法
Nov 30 Javascript
AngularJS操作键值对象类似java的hashmap(填坑小结)
Nov 12 Javascript
深入理解AngularJS中的ng-bind-html指令
Mar 27 Javascript
javaScript产生随机数的用法小结
Apr 21 Javascript
vue 双向数据绑定的实现学习之监听器的实现方法
Nov 30 Javascript
解决vuex数据异步造成初始化的时候没值报错问题
Nov 13 Javascript
微信小程序实现列表的横向滑动方式
Jul 15 Javascript
jquery随意添加移除html的实现代码
Jun 21 #Javascript
基于Jquery实现表格动态分页实现代码
Jun 21 #Javascript
基于jquery实现的表格分页实现代码
Jun 21 #Javascript
jquery异步请求实例代码
Jun 21 #Javascript
读jQuery之九 一些瑕疵说明
Jun 21 #Javascript
读jQuery之八 包装事件对象
Jun 21 #Javascript
读jQuery之七 判断点击了鼠标哪个键的代码
Jun 21 #Javascript
You might like
高亮度显示php源代码
2006/10/09 PHP
通过缓存数据库结果提高PHP性能的原理介绍
2012/09/05 PHP
织梦sitemap地图实时推送给百度的教程
2015/08/03 PHP
服务器迁移php版本不同可能诱发的问题
2015/12/22 PHP
php基于Redis消息队列实现的消息推送的方法
2018/11/28 PHP
JQuery中判断一个元素下面是否有内容或者有某个标签的判断代码
2012/02/02 Javascript
node.js中的fs.createReadStream方法使用说明
2014/12/17 Javascript
js简单实现点击左右运动的方法
2015/04/10 Javascript
浅谈javascript中replace()方法
2015/11/10 Javascript
jQuery中each()、find()和filter()等节点操作方法详解(推荐)
2016/05/25 Javascript
全面接触神奇的Bootstrap导航条实战篇
2016/08/01 Javascript
学习使用jQuery表单验证插件和日历插件
2017/02/13 Javascript
使用jQuery操作DOM的方法小结
2017/02/27 Javascript
基于vue v-for 循环复选框-默认勾选第一个的实现方法
2018/03/03 Javascript
基于express中路由规则及获取请求参数的方法
2018/03/12 Javascript
详解Vue.js使用Swiper.js在iOS
2018/09/10 Javascript
vue实现循环切换动画
2018/10/17 Javascript
详解Next.js页面渲染的优化方案
2019/01/27 Javascript
微信小程序实现的picker多级联动功能示例
2019/05/23 Javascript
layui使用button按钮 点击出现弹层 弹层中加载表单的实例
2019/09/04 Javascript
Node.js之删除文件夹(含递归删除)代码实例
2019/09/09 Javascript
webpack是如何实现模块化加载的方法
2019/11/06 Javascript
uni-app使用countdown插件实现倒计时
2020/11/01 Javascript
Python中使用items()方法返回字典元素对的教程
2015/05/21 Python
python检索特定内容的文本文件实例
2018/06/05 Python
在python中利用KNN实现对iris进行分类的方法
2018/12/11 Python
python实现对象列表根据某个属性排序的方法详解
2019/06/11 Python
Tensorflow实现将标签变为one-hot形式
2020/05/22 Python
世界上第一个水枕头:Mediflow
2018/12/06 全球购物
德国大型箱包和皮具商店:Koffer
2019/10/01 全球购物
迪士尼法国在线商店:shopDisney FR
2020/12/03 全球购物
文秘专业自荐信
2013/10/14 职场文书
计算机专业学生的自我评价
2013/12/15 职场文书
十岁生日家长答谢词
2014/01/17 职场文书
2015年端午节国旗下演讲稿
2015/03/19 职场文书
小学体育跳绳课教学反思
2016/02/16 职场文书