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获取DOM元素位置和尺寸大小的方法
Apr 12 Javascript
window.location.href = window.location.href 跳转无反应 a超链接onclick事件写法
Aug 21 Javascript
javascript学习笔记--数字格式类型
May 22 Javascript
js+css3制作时钟特效
Oct 16 Javascript
Bootstrap整体框架之JavaScript插件架构
Dec 15 Javascript
Vue.js 递归组件实现树形菜单(实例分享)
Dec 21 Javascript
vue.js的提示组件
Mar 02 Javascript
JavaScript代码判断输入的字符串是否含有特殊字符和表情代码实例
Aug 17 Javascript
node跨域请求方法小结
Aug 25 Javascript
JavaScript实现计算圆周率到小数点后100位的方法示例
May 08 Javascript
微信小程序自定义多选事件的实现代码
May 17 Javascript
解决layui调用自定义方法提示未定义的问题
Sep 14 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
zend framework多模块多布局配置
2011/02/26 PHP
完善CodeIgniter在IDE中代码提示功能的方法
2014/07/19 PHP
php实现将HTML页面转换成word并且保存的方法
2016/10/14 PHP
centos下file_put_contents()无法写入文件的原因及解决方法
2017/04/01 PHP
Yii框架分页实现方法详解
2017/05/20 PHP
PHP根据key删除数组中指定的元素
2019/02/28 PHP
超级简单的图片防盗(HTML),好用
2007/04/08 Javascript
广告切换效果(缓动切换)
2009/05/27 Javascript
跨浏览器的 mouseenter mouseleave 以及 compareDocumentPosition的使用说明
2010/05/04 Javascript
JavaScript中链式调用之研习
2011/04/07 Javascript
JavaScript的类型、值和变量小结
2015/07/09 Javascript
jquery实现简单的全选和反选功能
2016/01/02 Javascript
vue开发心得和技巧分享
2016/10/27 Javascript
Angular 4.x 路由快速入门学习
2017/05/03 Javascript
angularjs2 ng2 密码隐藏显示的实例代码
2017/08/01 Javascript
在 Node.js 中使用 async 函数的方法
2017/11/17 Javascript
vue实现的双向数据绑定操作示例
2018/12/04 Javascript
python实现去除下载电影和电视剧文件名中的多余字符的方法
2014/09/23 Python
连接Python程序与MySQL的教程
2015/04/29 Python
浅谈Python 对象内存占用
2016/07/15 Python
python实现感知器算法(批处理)
2019/01/18 Python
python对 MySQL 数据库进行增删改查的脚本
2020/10/22 Python
利用纯CSS3实现tab选项卡切换示例代码
2016/09/21 HTML / CSS
香蕉共和国工厂店:Banana Republic Factory
2018/06/09 全球购物
HEMA英国:荷兰原创设计
2018/08/28 全球购物
印度首个本地在线平台:nearbuy
2019/03/28 全球购物
OSPREY LONDON官网:英国本土皮具品牌
2019/05/31 全球购物
新教师工作感言
2014/02/16 职场文书
3.12植树节活动总结2014
2014/03/13 职场文书
早会主持词
2014/03/17 职场文书
《少年王勃》教学反思
2014/04/27 职场文书
保护野生动物倡议书
2014/05/16 职场文书
机关搬迁方案
2014/05/18 职场文书
学校捐款活动总结
2015/05/09 职场文书
2019年恭贺升学祝福语集锦
2019/08/15 职场文书
MySQL使用IF语句及用case语句对条件并结果进行判断 
2022/09/23 MySQL