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 相关文章推荐
jQuery .attr()和.removeAttr()方法操作元素属性示例
Jul 16 Javascript
购物车选中得到价格实现示例
Jan 26 Javascript
JavaScript实现三阶幻方算法谜题解答
Dec 29 Javascript
给easyui的datebox控件添加清空按钮的实现方法
Nov 09 Javascript
老生常谈jquery中detach()和remove()的区别
Mar 02 Javascript
canvas基础绘制-绚丽倒计时的实例
Sep 17 Javascript
Vue.js 事件修饰符的使用教程
Nov 01 Javascript
js实现经典贪吃蛇小游戏
Mar 19 Javascript
JS删除数组指定值常用方法详解
Jun 04 Javascript
Vue axios 跨域请求无法带上cookie的解决
Sep 08 Javascript
vue项目中企业微信使用js-sdk时config和agentConfig配置方式详解
Dec 15 Vue.js
Vue3 Composition API的使用简介
Mar 29 Vue.js
浅谈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
PHP中$_SERVER的详细参数与说明
2008/07/29 PHP
php $_SERVER[&quot;REQUEST_URI&quot;]获取值的通用解决方法
2010/06/21 PHP
php堆排序(heapsort)练习
2013/11/13 PHP
PHP+Ajax+JS实现多图上传
2016/05/07 PHP
vmware linux系统安装最新的php7图解
2019/04/14 PHP
PHP 实现重载
2021/03/09 PHP
table insertRow、deleteRow定义和用法总结
2014/05/14 Javascript
使用cluster 将自己的Node服务器扩展为多线程服务器
2014/11/10 Javascript
JavaScript实现鼠标滑过处生成气泡的方法
2015/05/16 Javascript
js中substring和substr两者区别和使用方法
2015/11/09 Javascript
基于jQuery实现放大镜特效
2020/10/19 Javascript
你不知道的高性能JAVASCRIPT
2016/01/18 Javascript
JQuery中attr属性和jQuery.data()学习笔记【必看】
2016/05/18 Javascript
Angular4自制一个市县二级联动组件示例
2017/11/21 Javascript
Seajs源码详解分析
2019/04/02 Javascript
我所理解的JavaScript中的this指向
2020/09/04 Javascript
python开发之thread线程基础实例入门
2015/11/11 Python
python DataFrame 修改列的顺序实例
2018/04/10 Python
Django1.9 加载通过ImageField上传的图片方法
2018/05/25 Python
Django 视图层(view)的使用
2018/11/09 Python
Python实现的微信支付方式总结【三种方式】
2019/04/13 Python
Python中@property的理解和使用示例
2019/06/11 Python
django 2.2和mysql使用的常见问题
2019/07/18 Python
python绘制BA无标度网络示例代码
2019/11/21 Python
Python:slice与indices的用法
2019/11/25 Python
浅谈matplotlib中FigureCanvasXAgg的用法
2020/06/16 Python
详解pytorch tensor和ndarray转换相关总结
2020/09/03 Python
加拿大消费电子和手机购物网站:The Source
2017/01/28 全球购物
机械专业毕业生自荐信
2013/11/02 职场文书
女娲补天教学反思
2014/02/05 职场文书
英文请假条
2014/04/11 职场文书
员工工作表现评语
2014/04/26 职场文书
司法所长先进事迹
2014/06/02 职场文书
中学政教处工作总结
2015/08/13 职场文书
Java Shutdown Hook场景使用及源码分析
2021/06/15 Java/Android
javascript函数式编程基础
2021/09/15 Javascript