JQuery select控件的相关操作实现代码


Posted in Javascript onSeptember 14, 2012

获取select
先看看下面代码:

$("#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最大的索引值 
$("#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的项选中

获取select 选中的 text :
$("#ddlRegType").find("option:selected").text();

获取select选中的 value:
$("#nowamagic").val();

获取select选中的索引:
$("#nowamagic").get(0).selectedIndex;

设置select
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

设置select 选中的索引:
//index为索引值 
$("#nowamagic").get(0).selectedIndex=index;

设置select 选中的value:
$("#nowamagic").attr("value","Normal"); 
$("#nowamagic").val("Normal"); 
$("#nowamagic").get(0).value = value;

设置select 选中的text:
var count=$("#nowamagicoption").length; 
for(var i=0;i<count;i++) 
{ if($("#nowamagic").get(0).options[i].text == text) 
{ 
$("#nowamagic").get(0).options[i].selected = true; break; 
} 
}

清空 select:
$("#nowamagic").empty();
Javascript 相关文章推荐
jq选项卡鼠标延迟的插件实例
May 13 Javascript
javascript中返回顶部按钮的实现
May 05 Javascript
如何解决ligerUI布局时Center中的Tab高度大小
Nov 24 Javascript
深入浅析JavaScript中的arguments对象(强力推荐)
Jun 03 Javascript
js实现年月日表单三级联动
Apr 17 Javascript
前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来
Nov 14 jQuery
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 jQuery
利用vscode调试编译后的js代码详解
May 14 Javascript
手把手教你用Node.js爬虫爬取网站数据的方法
Jul 05 Javascript
常见的浏览器存储方式(cookie、localStorage、sessionStorage)
May 07 Javascript
webpack3升级到webpack4遇到问题总结
Sep 30 Javascript
Servlet返回的数据js解析2种方法
Dec 12 Javascript
11个用于提高排版水平的基于jquery的文字效果插件
Sep 14 #Javascript
六款帮助你实现惊艳视差滚动效果的jQuery插件
Sep 14 #Javascript
推荐17个优美新鲜的jQuery的工具提示插件
Sep 14 #Javascript
Java 正则表达式学习总结和一些小例子
Sep 13 #Javascript
获取客户端电脑日期时间js代码(jquery)
Sep 12 #Javascript
IE中jquery.form中ajax提交没反应解决方法分享
Sep 11 #Javascript
jquery ajax例子返回值详解
Sep 11 #Javascript
You might like
PHP的邮件群发系统phplist配置方法详细总结
2016/03/30 PHP
CodeIgniter集成smarty的方法详解
2016/05/26 PHP
[原创]PHP global全局变量经典应用与注意事项分析【附$GLOBALS用法对比】
2019/07/12 PHP
摘自百度的图片轮换效果代码
2007/11/19 Javascript
jquery 事件执行检测代码
2009/12/09 Javascript
Prototype源码浅析 String部分(二)
2012/01/16 Javascript
JS动态添加与删除select中的Option对象(示例代码)
2013/12/25 Javascript
PhotoShop给图片自动添加边框及EXIF信息的JS脚本
2015/02/15 Javascript
JS根据生日算年龄的方法
2015/05/05 Javascript
JS实现简洁、全兼容的拖动层实例
2015/05/13 Javascript
Angular.JS利用ng-disabled属性和ng-model实现禁用button效果
2017/04/05 Javascript
JavaScript实现选中文字提示新浪微博分享效果
2017/06/15 Javascript
VUE + UEditor 单图片跨域上传功能的实现方法
2018/02/08 Javascript
基于Vue实现图片在指定区域内移动的思路详解
2018/11/11 Javascript
解决微信小程序调用moveToLocation失效问题【超简单】
2019/04/12 Javascript
JS前端知识点总结之页面加载事件,数组操作,DOM节点操作,循环和分支
2019/07/04 Javascript
electron 安装,调试,打包的具体使用
2019/11/06 Javascript
Python实现根据指定端口探测服务器/模块部署的方法
2014/08/25 Python
使用Python编写简单的端口扫描器的实例分享
2015/12/18 Python
Python2.7编程中SQLite3基本操作方法示例
2017/08/09 Python
在scrapy中使用phantomJS实现异步爬取的方法
2018/12/17 Python
Python 获取ftp服务器文件时间的方法
2019/07/02 Python
Python面向对象程序设计之私有变量,私有方法原理与用法分析
2020/03/23 Python
Python3利用openpyxl读写Excel文件的方法实例
2021/02/03 Python
Java面试题汇总
2015/12/06 面试题
金属材料工程毕业生个人的自我评价
2013/11/28 职场文书
财务会计专业求职信范文
2013/12/31 职场文书
外贸采购员岗位职责
2014/03/08 职场文书
模特大赛策划方案
2014/05/28 职场文书
2014年工程工作总结
2014/11/25 职场文书
2019初中学生入团申请书
2019/06/27 职场文书
导游词之藏龙百瀑景区
2019/12/30 职场文书
Python一些基本的图像操作和处理总结
2021/06/23 Python
十大必看国产动漫排名,魁拔上线,第二曾在日本播出
2022/03/18 国漫
一次线上mongo慢查询问题排查处理记录
2022/03/18 MongoDB
Python实现信息管理系统
2022/06/05 Python