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 相关文章推荐
GWT中复制到剪贴板 js+flash实现复制 兼容性比较好
Mar 07 Javascript
javascript针对DOM的应用分析(三)
Apr 15 Javascript
可编辑下拉框的2种实现方式
Jun 13 Javascript
jQuery学习笔记之2个小技巧
Jan 19 Javascript
jQuery中on()方法用法实例
Jan 19 Javascript
jquery实现增加删除行的方法
Feb 03 Javascript
js获取地址栏中传递的参数(两种方法)
Feb 08 Javascript
详解Node全局变量global模块
Sep 28 Javascript
探讨Vue.js的组件和模板
Oct 27 Javascript
微信小程序实现列表下拉刷新上拉加载
Jul 29 Javascript
详解简单易懂的 ES6 Iterators 指南和示例
Sep 24 Javascript
element-ui如何防止重复提交的方法步骤
Dec 09 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
php的access操作类
2008/04/09 PHP
php+AJAX传送中文会导致乱码的问题的解决方法
2008/09/08 PHP
PHP原生模板引擎 最简单的模板引擎
2012/04/25 PHP
php求斐波那契数的两种实现方式【递归与递推】
2019/09/09 PHP
DOM2非标准但却支持很好的几个属性小结
2012/01/21 Javascript
JS取文本框中最小值的简单实例
2013/11/29 Javascript
jquery.validate.js插件使用经验记录
2014/07/02 Javascript
javaScript中with函数用法实例分析
2015/06/08 Javascript
AngularJS在IE8的不支持的解决方法
2016/05/13 Javascript
使用jQuery ajaxupload插件实现无刷新上传文件
2017/04/23 jQuery
Vue.js在数组中插入重复数据的实现代码
2017/11/17 Javascript
基于nodejs实现微信支付功能
2017/12/20 NodeJs
通过webpack引入第三方库的方法
2018/07/20 Javascript
解决Vue中 父子传值 数据丢失问题
2019/08/27 Javascript
基于javascript实现日历功能原理及代码实例
2020/05/07 Javascript
vue.js实现h5机器人聊天(测试版)
2020/07/16 Javascript
学习python (2)
2006/10/31 Python
python调用新浪微博API项目实践
2014/07/28 Python
Python中的包和模块实例
2014/11/22 Python
解析Python中的__getitem__专有方法
2016/06/27 Python
Python2/3中urllib库的一些常见用法
2017/12/19 Python
python实现飞机大战
2018/09/11 Python
Django中的forms组件实例详解
2018/11/08 Python
python 实现提取某个索引中某个时间段的数据方法
2019/02/01 Python
django获取from表单multiple-select的value和id的方法
2019/07/19 Python
解决Pycharm 包已经下载,但是运行代码提示找不到模块的问题
2019/08/31 Python
Pytorch学习之torch用法----比较操作(Comparison Ops)
2020/06/28 Python
浅谈python出错时traceback的解读
2020/07/15 Python
德国高性价比网上药店:medpex
2017/07/09 全球购物
泰国的头号网上婴儿用品店:Motherhood.co.th
2019/04/09 全球购物
STRATHBERRY苏贝瑞包包官网:西班牙高级工匠手工打造
2020/11/10 全球购物
九年级英语教学反思
2014/01/31 职场文书
颐和园导游词
2015/01/30 职场文书
Django实现翻页的示例代码
2021/05/24 Python
MySQL创建管理KEY分区
2022/04/13 MySQL
Python sklearn分类决策树方法详解
2022/09/23 Python