jQuery增加、删除及修改select option的方法


Posted in Javascript onAugust 19, 2016

本文实例讲述了jQuery增加、删除及修改select option的方法。分享给大家供大家参考,具体如下:

jQuery获取Select选择的Text和Value:

1.

//获取Select选择的Text
var checkText=jQuery("#select_id").find("option:selected").text();

2.

//获取Select选择的option Value
var checkValue=jQuery("#select_id").val();

3.

//获取Select选择的索引值
var checkIndex=jQuery("#select_id ").get(0).selectedIndex;

4.

//获取Select最大的索引值
var maxIndex=jQuery("#select_id option:last").attr("index");

jQuery添加/删除Select的Option项:

1.

//为Select追加一个Option(下拉项)
jQuery("#select_id").append("<option value='Value'>Text</option>");

2.

//为Select插入一个Option(第一个位置)
jQuery("#select_id").prepend("<option value='0'>请选择</option>");

3.

//删除Select中索引值最大Option(最后一个)
jQuery("#select_id option:last").remove();

4.

//删除Select中索引值为0的Option(第一个)
jQuery("#select_id option[index='0']").remove();

5.

//删除Select中Value='3'的Option
jQuery("#select_id option[value='3']").remove();

6.

//删除Select中Text='4'的Option
jQuery("#select_id option[text='4']").remove();

内容清空:

jQuery("#select_id").empty();

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript入门教程(10) 认识其他对象
Jan 31 Javascript
浅析JavaScript中的类型和对象
Nov 29 Javascript
JS实现根据出生年月计算年龄
Jan 10 Javascript
Javascript必知必会(四)js类型转换
Jun 08 Javascript
对vue.js中this.$emit的深入理解
Feb 23 Javascript
Angular 组件之间的交互的示例代码
Mar 24 Javascript
webpack4 + react 搭建多页面应用示例
Aug 03 Javascript
解决Vue axios post请求,后台获取不到数据的问题方法
Aug 11 Javascript
Vue项目自动转换 px 为 rem的实现方法
Oct 29 Javascript
利用hasOwnProperty给数组去重的面试题分享
Nov 05 Javascript
原生js实现下拉选项卡
Nov 27 Javascript
JS localStorage存储对象,sessionStorage存储数组对象操作示例
Feb 15 Javascript
浅谈jquery设置和获得checkbox选中的问题
Aug 19 #Javascript
AngularJS入门教程之过滤器详解
Aug 19 #Javascript
js判断checkbox是否选中个数的方法(超简单)
Aug 19 #Javascript
Angular设置title信息解决SEO方面存在问题
Aug 19 #Javascript
js仿腾讯QQ的web登陆界面
Aug 19 #Javascript
基于WebUploader的文件上传js插件
Aug 19 #Javascript
JS获取checkbox的个数简单实例
Aug 19 #Javascript
You might like
学习discuz php 引入文件的方法DISCUZ_ROOT
2009/06/21 PHP
封装一个PDO数据库操作类代码
2009/09/09 PHP
配置php.ini实现PHP文件上传功能
2014/11/27 PHP
php+ajax 实现输入读取数据库显示匹配信息
2015/10/08 PHP
两个JavaScript jsFiddle JSBin在线调试器
2010/03/14 Javascript
javascript与CSS复习(二)
2010/06/29 Javascript
基于Jquery的文字滚动跑马灯插件(一个页面多个滚动区)
2010/07/26 Javascript
JavaScript的类型转换(字符转数字 数字转字符)
2010/08/30 Javascript
往光标所在位置插入值的js代码
2013/09/22 Javascript
jQuery中parents()和parent()的区别分析
2014/10/28 Javascript
jQuery动态星级评分效果实现方法
2015/08/06 Javascript
js实现向右横向滑出的二级菜单效果
2015/08/27 Javascript
Bootstrap每天必学之进度条
2015/11/30 Javascript
浅析JS中对函数function的理解(基础篇)
2016/10/14 Javascript
谈谈JavaScript中浏览器兼容问题的写法小议
2016/12/17 Javascript
jQuery Pagination分页插件使用方法详解
2017/02/28 Javascript
微信小程序(订阅消息)功能
2019/10/25 Javascript
NodeJS多种创建WebSocket监听的方式(三种)
2020/06/04 NodeJs
IDEA配置jQuery, $符号不再显示黄色波浪线的问题
2020/10/09 jQuery
[02:26]2018DOTA2亚洲邀请赛赛前采访-Newbee篇
2018/04/03 DOTA
说一说Python logging
2016/04/15 Python
python查询mysql,返回json的实例
2018/03/26 Python
Python实现查看系统启动项功能示例
2018/05/10 Python
Python分支语句与循环语句应用实例分析
2019/05/07 Python
详解Python3迁移接口变化采坑记
2019/10/11 Python
巧用CSS3 border实现图片遮罩效果代码
2012/04/09 HTML / CSS
国际化的太阳镜及太阳镜配件零售商:Sunglass Hut
2016/07/26 全球购物
2013年保送生自荐信格式
2013/11/20 职场文书
期末自我鉴定
2014/01/23 职场文书
十八大感想感言
2014/02/10 职场文书
工作失职检讨书(精华篇)
2014/10/15 职场文书
应急管理工作总结2015
2015/05/04 职场文书
幼儿园教师教育随笔
2015/08/14 职场文书
安全生产协议书
2016/03/22 职场文书
如何Tomcat中使用ipv6地址
2022/05/06 Servers
MySQL中LAG()函数和LEAD()函数的使用
2022/08/14 MySQL