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 - HTML的request类
Jul 15 Javascript
找到一点可怜的关于dojo资料,谢谢作者!
Dec 06 Javascript
一个可以兼容IE FF的加为首页与加入收藏实现代码
Nov 02 Javascript
Array.prototype 的泛型应用分析
Apr 30 Javascript
jquery插件制作 提示框插件实现代码
Aug 17 Javascript
详解JavaScript函数绑定
Aug 18 Javascript
jQuery ajax dataType值为text json探索分享
Sep 23 Javascript
JQuery自动触发事件的方法
Jun 13 Javascript
JS清除文本框内容离开在恢复及鼠标离开文本框时触发js的方法
Jan 12 Javascript
JavaScript利用闭包实现模块化
Jan 13 Javascript
node.js的exports、module.exports与ES6的export、export default深入详解
Oct 26 Javascript
vue-cli下的vuex的简单Demo图解(实现加1减1操作)
Feb 26 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
php 搜索框提示(自动完成)实例代码
2012/02/05 PHP
php文件上传的两种实现方法
2016/04/04 PHP
PHP7扩展开发之hello word实现方法详解
2018/01/15 PHP
javascript编程起步(第一课)
2007/01/10 Javascript
Div Select挡住的解决办法
2008/08/07 Javascript
使用JavaScript检测Firefox浏览器是否启用了Firebug的代码
2010/12/28 Javascript
jQuery 常见操作实现方式和常用函数方法总结
2011/05/06 Javascript
JavaScript中的property和attribute介绍
2011/12/26 Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
2013/01/24 Javascript
对table和ul实现js分页示例分享
2014/02/24 Javascript
ajaxFileUpload.js插件支持多文件上传的方法
2014/09/02 Javascript
js用拖动滑块来控制图片大小的方法
2015/02/27 Javascript
分享十五款 jQuery 社交网络分享插件
2015/05/16 Javascript
JavaScript 七大技巧(一)
2015/12/13 Javascript
原生JS封装ajax 传json,str,excel文件上传提交表单(推荐)
2016/06/21 Javascript
jQuery插件简单学习实例教程
2016/07/01 Javascript
微信小程序 条件渲染详解
2016/10/09 Javascript
Vue.Js中的$watch()方法总结
2017/03/23 Javascript
Vue.js框架路由使用方法实例详解
2017/08/25 Javascript
Dropify.js图片宽高自适应的方法
2017/11/27 Javascript
使用electron实现百度网盘悬浮窗口功能的示例代码
2018/10/24 Javascript
python实现ipsec开权限实例
2014/11/11 Python
python妙用之编码的转换详解
2017/04/21 Python
如何优雅地改进Django中的模板碎片缓存详解
2018/07/04 Python
Python魔法方法 容器部方法详解
2020/01/02 Python
python实现3D地图可视化
2020/03/25 Python
解析Python 偏函数用法全方位实现
2020/06/26 Python
详解tensorflow之过拟合问题实战
2020/11/01 Python
CSS3实现淘宝留白的方法
2020/06/05 HTML / CSS
德国大型箱包和皮具商店:Koffer
2019/10/01 全球购物
电气工程及自动化专业自荐书范文
2013/12/18 职场文书
个人简历自我评价范文
2014/02/04 职场文书
初中同学会活动方案
2014/08/22 职场文书
授权委托书协议书
2014/10/16 职场文书
业务员岗位职责
2015/02/03 职场文书
Python实现数据的序列化操作详解
2022/07/07 Python