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 相关文章推荐
Js实现双击鼠标自动滚动屏幕的示例代码
Dec 14 Javascript
用模版生成HTML的的框架jquery.tmpl使用详解
Jan 07 Javascript
JS函数的几种定义方式分析
Dec 17 Javascript
浅谈layer的iframe弹窗给里面的标签赋值的问题
Nov 10 Javascript
浅析BootStrap中Modal(模态框)使用心得
Dec 24 Javascript
js Canvas绘制圆形时钟效果
Feb 17 Javascript
JavaScript实现二分查找实例代码
Feb 22 Javascript
js实现手机发送验证码功能
Mar 13 Javascript
Angular 作用域scope的具体使用
Dec 11 Javascript
vue + webpack如何绕过QQ音乐接口对host的验证详解
Jul 01 Javascript
利用Angular7开发一个Radio组件的全过程
Jul 11 Javascript
JS实现简单移动端鼠标拖拽
Jul 23 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
星际争霸任务指南——神族
2020/03/04 星际争霸
PHP管理内存函数 memory_get_usage()使用介绍
2012/09/23 PHP
PHP判断表单复选框选中状态完整例子
2014/06/24 PHP
php计算指定目录下文件占用空间的方法
2015/03/13 PHP
php 数据结构之链表队列
2017/10/17 PHP
PHP实现的mongoDB数据库操作类完整实例
2018/04/10 PHP
php实现的rc4加密解密类定义与用法示例
2018/08/16 PHP
PHP使用ajax的post方式下载excel文件简单示例
2019/08/06 PHP
二级域名或跨域共享Cookies的实现方法
2008/08/07 Javascript
最简单的jQuery程序 入门者学习
2009/07/09 Javascript
javascript延时加载之defer测试
2012/12/28 Javascript
Jquery封装tab自动切换效果的具体实现
2013/07/13 Javascript
js克隆对象、数组的常用方法介绍
2013/09/26 Javascript
jquery操作cookie插件分享
2014/01/14 Javascript
100个不能错过的实用JS自定义函数
2014/03/05 Javascript
JavaScript每天必学之基础知识
2016/09/17 Javascript
react-native使用leanclound消息推送的方法
2018/08/06 Javascript
深入解析ES6中的promise
2018/11/08 Javascript
Angular6新特性之Angular Material
2018/12/28 Javascript
Next.js实现react服务器端渲染的方法示例
2019/01/06 Javascript
转换layUI的数据表格中的日期格式方法
2019/09/19 Javascript
Javascript模块化机制实现原理详解
2020/04/02 Javascript
微信小程序之高德地图多点路线规划过程示例详解
2021/01/18 Javascript
python通过urllib2爬网页上种子下载示例
2014/02/24 Python
Python3实现将文件归档到zip文件及从zip文件中读取数据的方法
2015/05/22 Python
用python实现对比两张图片的不同
2018/02/05 Python
Python多继承顺序实例分析
2018/05/26 Python
python主线程捕获子线程的方法
2018/06/17 Python
python实现彩票系统
2020/06/28 Python
Python 实现中值滤波、均值滤波的方法
2019/01/09 Python
python使用turtle库绘制奥运五环
2020/02/24 Python
HTML5边玩边学(1)画布实现方法
2010/09/21 HTML / CSS
美国宠物美容和宠物用品购物网站:Cherrybrook
2018/12/07 全球购物
图书室管理制度
2014/01/19 职场文书
2015毕业设计工作总结
2015/07/24 职场文书
写作指导:怎么书写竞聘演讲稿?
2019/07/04 职场文书