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 相关文章推荐
18个非常棒的jQuery代码片段
Nov 02 Javascript
js实现字符串和数组之间相互转换操作
Jan 12 Javascript
Bootstrap Table使用心得总结
Nov 29 Javascript
AngularJS中$apply方法和$watch方法用法总结
Dec 13 Javascript
JS触摸与手势事件详解
May 09 Javascript
fetch 使用及如何接收JS传值
Nov 11 Javascript
解决koa2 ctx.render is not a function报错问题
Aug 07 Javascript
AngularJS发送异步Get/Post请求方法
Aug 13 Javascript
小程序实现列表多个批量倒计时
Jan 29 Javascript
layui动态渲染生成左侧3级菜单的方法(根据后台返回数据)
Sep 23 Javascript
Vue 实现从文件中获取文本信息的方法详解
Oct 16 Javascript
JS如何实现封装列表右滑动删除收藏按钮
Jul 23 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
Zend Framework实现多服务器共享SESSION数据的方法
2016/03/22 PHP
Ajax提交表单时验证码自动验证 php后端验证码检测
2016/07/20 PHP
php中实现进程锁与多进程的方法
2016/09/18 PHP
PHP基于正则批量替换Img中src内容实现获取缩略图的功能示例
2017/06/07 PHP
一段批量给页面上的控件赋值js
2010/06/19 Javascript
基于jquery的无刷新分页技术
2011/06/11 Javascript
JS cookie中文乱码解决方法
2014/01/28 Javascript
ExtJS4给Combobox设置列表中的默认值示例
2014/05/02 Javascript
详谈LABJS按需动态加载js文件
2015/05/07 Javascript
JavaScript小技巧整理
2015/12/30 Javascript
javascript实现查找数组中最大值方法汇总
2016/02/13 Javascript
Javascript的表单验证长度
2016/03/16 Javascript
AngularJS入门教程引导程序
2016/08/18 Javascript
KnockoutJS 3.X API 第四章之表单value绑定
2016/10/10 Javascript
Bootstrap基本插件学习笔记之标签切换(17)
2016/12/08 Javascript
video.js使用改变ui过程
2017/03/05 Javascript
VUE多层路由嵌套实现代码
2017/05/15 Javascript
vue的diff算法知识点总结
2018/03/29 Javascript
javascript中undefined的本质解析
2019/07/31 Javascript
Nodejs 识别图片类型的方法
2019/08/15 NodeJs
JavaScript中的全局属性与方法深入解析
2020/06/14 Javascript
[05:20]卡尔工作室_DOTA2新手教学_DOTA2超强新手功能
2013/04/22 DOTA
Python中的二叉树查找算法模块使用指南
2014/07/04 Python
Python中字典和JSON互转操作实例
2015/01/19 Python
Django日志模块logging的配置详解
2017/02/14 Python
在PyTorch中Tensor的查找和筛选例子
2019/08/18 Python
python判断一个变量是否已经设置的方法
2020/08/13 Python
教你打造完美的创业计划书
2014/01/06 职场文书
办理护照介绍信
2014/01/16 职场文书
婚庆司仪主持词
2014/03/15 职场文书
秋天的怀念教学反思
2014/04/28 职场文书
建筑学专业自荐书
2014/07/09 职场文书
离婚协议书怎么写2014
2014/09/30 职场文书
老干部工作汇报材料
2014/10/28 职场文书
超市主管竞聘书
2015/09/15 职场文书
MySQL 不等于的三种使用及区别
2021/06/03 MySQL