JS、jQuery中select的用法详解


Posted in Javascript onApril 21, 2016

1.js

var obj=document.getElementById(selectid);
obj.options.length = 0; //清除所有内容
obj.options[index] = new Option("three",3); //更改对应的值
obj.options[index].selected = true; //保持选中状态
obj.add(new Option("4","4")); ”文本",”值"
var index = obj.selectedIndex;obj.options.remove(index);//删除选中项

2.jquery

$("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项)
$("#select_id").").find('option:selected').text(); 获取select选中的text
$("#select_id").val(); 获取select选中的value
$("#select_id option[index='0']").remove();//删除索引值为0的Option
$("#select_id option[value='3']").remove(); //删除值为3的Option
$("#select_id option[text='4']").remove(); //删除TEXT值为4的Option
$("#mselect_id").change(function(){
//添加所需要执行的操作代码
})

补充: js获取select标签选中的值

var obj = document.getElementByIdx_x(”testSelect”); //定位id
var index = obj.selectedIndex; // 选中索引
var text = obj.options[index].text; // 选中文本
var value = obj.options[index].value; // 选中值

jQuery中获得选中select值

第一种方式

$('#testSelect option:selected').text();//选中的文本
$('#testSelect option:selected') .val();//选中的值
$("#testSelect ").get(0).selectedIndex;//索引

第二种方式

$("#tesetSelect").find("option:selected").text();//选中的文本
…….val();
…….get(0).selectedIndex;

以上内容是小编给大家介绍的JS、jQuery中select的用法详解,希望对大家有所帮助!

Javascript 相关文章推荐
网页禁用右键实现代码(JavaScript代码)
Oct 29 Javascript
腾讯UED 漂亮的提示信息效果代码
Sep 12 Javascript
JS使用replace()方法和正则表达式进行字符串的搜索与替换实例
Apr 10 Javascript
判断iframe里的页面是否加载完成
Jun 06 Javascript
JavaScript代码实现禁止右键、禁选择、禁粘贴、禁shift、禁ctrl、禁alt
Nov 17 Javascript
javascript中数组(Array)对象和字符串(String)对象的常用方法总结
Dec 15 Javascript
JS及JQuery对Html内容编码,Html转义
Feb 17 Javascript
vue结合axios与后端进行ajax交互的方法
Jul 06 Javascript
用 js 写一个 js 解释器过程详解
Aug 02 Javascript
JS函数基本定义与用法示例
Jan 15 Javascript
JavaScript array常用方法代码实例详解
Sep 02 Javascript
解决vue中使用less/sass及使用中遇到无效的问题
Oct 24 Javascript
jQuery中iframe的操作(点击按钮新增窗口)
Apr 20 #Javascript
JS生成某个范围的随机数【四种情况详解】
Apr 20 #Javascript
浅析JS动态创建元素【两种方法】
Apr 20 #Javascript
纯JS代码实现一键分享功能
Apr 20 #Javascript
JavaScript动态生成二维码图片
Apr 20 #Javascript
JS动态创建元素的两种方法
Apr 20 #Javascript
深入浅析Extjs中store分组功能的使用方法
Apr 20 #Javascript
You might like
日本收入最高的漫画家:海贼王作者版税年收入高达8.45亿元
2020/03/04 日漫
mysql 性能的检查和优化方法
2009/06/21 PHP
PHP实现提取一个图像文件并在浏览器上显示的代码
2012/10/06 PHP
详解php比较操作符的安全问题
2015/12/03 PHP
PHP生成制作验证码的简单实例
2016/06/12 PHP
PHP那些琐碎的知识点(整理)
2017/05/20 PHP
Yii框架响应组件用法实例分析
2019/09/04 PHP
基于PHP实现短信验证码发送次数限制
2020/07/11 PHP
js 表格隔行颜色
2009/12/02 Javascript
关于jQuery UI 使用心得及技巧
2012/10/10 Javascript
JavaScript实现自动弹出窗口并自动关闭窗口的方法
2015/08/06 Javascript
jQuery插件EasyUI校验规则 validatebox验证框
2015/11/29 Javascript
JavaScript 基础函数_深入剖析变量和作用域
2016/05/18 Javascript
简单学习vue指令directive
2016/11/03 Javascript
js入门之Function函数的使用方法【新手必看】
2016/11/22 Javascript
js中toString()和String()区别详解
2017/03/23 Javascript
深入解析js轮播插件核心代码的实现过程
2017/04/14 Javascript
Element-UI Table组件上添加列拖拽效果实现方法
2018/04/14 Javascript
React Native基础入门之初步使用Flexbox布局
2018/07/02 Javascript
对angular 监控数据模型变化的事件方法$watch详解
2018/10/09 Javascript
基于vue+axios+lrz.js微信端图片压缩上传方法
2019/06/25 Javascript
python使用urllib2实现发送带cookie的请求
2015/04/28 Python
深入讲解Python中的迭代器和生成器
2015/10/26 Python
python之Character string(实例讲解)
2017/09/25 Python
Python的argparse库使用详解
2018/10/09 Python
基于python实现学生管理系统
2018/10/17 Python
Python实现的登录验证系统完整案例【基于搭建的MVC框架】
2019/04/12 Python
Python爬虫逆向分析某云音乐加密参数的实例分析
2020/12/04 Python
欧舒丹澳洲版:L’OCCITANE
2017/07/17 全球购物
英语翻译系毕业生求职信
2013/09/29 职场文书
优秀党支部书记事迹材料
2014/05/29 职场文书
学院党的群众路线教育实践活动第一阶段情况汇报
2014/10/25 职场文书
党支部综合考察意见
2015/06/01 职场文书
2016年乡镇综治宣传月活动总结
2016/03/16 职场文书
Python使用BeautifulSoup4修改网页内容
2022/05/20 Python
Python通用验证码识别OCR库ddddocr的安装使用教程
2022/07/07 Python