jquery操作select方法汇总


Posted in Javascript onFebruary 05, 2015

本文实例汇总了jquery操作select的方法。分享给大家供大家参考。具体如下:

jQuery获取Select选择的Text和Value:     

语法解释:

$("#select_id").change(function(){//code...});//为Select添加事件,当选择其中一项时触发

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

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

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

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

jQuery设置Select选择的Text和Value:      

语法解释:

$("#select_id ").get(0).selectedIndex=1;//设置Select索引值为1的项选中

$("#select_id ").val(4);//设置Select的Value值为4的项选中

$("#select_id option[text='jQuery']").attr("selected", true);//设置Select的Text值为jQuery的项选中

jQuery添加/删除Select的Option项:

语法解释:      

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

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

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

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

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

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

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

Javascript 相关文章推荐
Prototype1.6 JS 官方下载地址
Nov 30 Javascript
Javascript 变量作用域 两个可能会被忽略的小特性
Mar 23 Javascript
js分解url参数(面向对象-极简主义法应用)
Aug 09 Javascript
深入学习JavaScript中的原型prototype
Aug 13 Javascript
bootstrap导航栏、下拉菜单、表单的简单应用实例解析
Jan 06 Javascript
原生js实现可拖拽效果
Feb 28 Javascript
react开发中如何使用require.ensure加载es6风格的组件
May 09 Javascript
JS动态添加元素及绑定事件造成程序重复执行解决
Dec 07 Javascript
JavaScript之数组扁平化详解
Jun 03 Javascript
八种Vue组件间通讯方式合集(推荐)
Aug 18 Javascript
解决vant框架做H5时踩过的坑(下拉刷新、上拉加载等)
Nov 11 Javascript
JavaScript获取URL参数的方法分享
Apr 07 Javascript
高性能JavaScript模板引擎实现原理详解
Feb 05 #Javascript
jquery操作复选框checkbox的方法汇总
Feb 05 #Javascript
js中hash和ico的关联分析
Feb 05 #Javascript
js与jquery实时监听输入框值的oninput与onpropertychange方法
Feb 05 #Javascript
moment.js轻松实现获取当前日期是当年的第几周
Feb 05 #Javascript
javascript判断移动端访问设备并解析对应CSS的方法
Feb 05 #Javascript
Javascript数组操作函数总结
Feb 05 #Javascript
You might like
Search Engine Friendly的URL设计
2006/10/09 PHP
PHP函数按引用传递参数及函数可选参数用法示例
2018/06/04 PHP
jquery选择checked在ie8普通模式下的问题
2014/02/12 Javascript
一款基于jQuery的图片场景标注提示弹窗特效
2015/01/05 Javascript
TypeError document.getElementById(...) is null错误原因
2015/05/18 Javascript
基于jQuery实现点击最后一行实现行自增效果的表格
2016/01/12 Javascript
使用puppeteer破解极验的滑动验证码
2018/02/24 Javascript
vue 实现剪裁图片并上传服务器功能
2018/03/01 Javascript
Angular数据绑定机制原理
2018/04/17 Javascript
javascript实现遮罩层动态效果实例
2019/05/14 Javascript
vue-cli webpack配置文件分析
2019/05/20 Javascript
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
2019/06/10 jQuery
js实现移动端轮播图滑动切换
2020/12/21 Javascript
[02:12]2019完美世界全国高校联赛(春季赛)报名开启
2019/03/01 DOTA
python中引用与复制用法实例分析
2015/06/04 Python
python开发之文件操作用法实例
2015/11/13 Python
python Matplotlib模块的使用
2020/09/16 Python
使用CSS3和Checkbox实现JQuery的一些效果
2015/08/03 HTML / CSS
英国最大的婴儿监视器网上商店:Baby Monitors Direct
2018/04/24 全球购物
诺心蛋糕官网:LE CAKE
2018/08/25 全球购物
全球性的在线婚纱礼服工厂:27dress.com
2019/03/21 全球购物
专科毕业生就业推荐信
2013/11/01 职场文书
幼儿如何来做好自我评价
2013/11/05 职场文书
物流专业毕业生推荐信范文
2013/11/18 职场文书
大学生活动策划方案
2014/02/10 职场文书
党员学习正风肃纪思想汇报
2014/09/12 职场文书
2014公司年终工作总结
2014/12/19 职场文书
六年级语文下册教学计划
2015/01/22 职场文书
2015年清明节网上祭英烈留言寄语
2015/03/04 职场文书
安全生产奖惩制度
2015/08/06 职场文书
2016年圣诞节寄语(一句话)
2015/12/07 职场文书
2016教师学习党章心得体会
2016/01/15 职场文书
励志语录:你若不勇敢,谁替你坚强
2019/11/08 职场文书
2019年暑期法院实习报告
2019/12/18 职场文书
MySQL系列之十五 MySQL常用配置和性能压力测试
2021/07/02 MySQL
Golang 对es的操作实例
2022/04/20 Golang