select获取下拉框的值 下拉框默认选中方法


Posted in Javascript onFebruary 28, 2018

本文主要介绍select下拉框的相关方法。

1、通过id获取下拉框的value和文本值

例如:

<select class="form-control" id="numbers">
      <option value="1">数字1</option>
      <option value="2" selected>数字2</option>
</select>
$("#numbers option:selected").val(); 获取到下拉框被选中的optionde value值:2;
$("#numbers option:selected").text(); 获取到下拉框被选中的optionde 文本内容:数字2;

2、默认选中某个select值:增加selected属性

select获取下拉框的值 下拉框默认选中方法

input框中输入数字,失去焦点时调用selectNumber()方法,选中与input框中相同的数字

function selectNumber(){
var num = $("#num").val(); //获取input中输入的数字
var numbers = $("#numbers").find("option"); //获取select下拉框的所有值
for (var j = 1; j < numbers.length; j++) {
if ($(numbers[j]).val() == num) {
$(numbers[j]).attr("selected", "selected");
}
} 
}

以上这篇select获取下拉框的值 下拉框默认选中方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用函数式编程技术编写优美的 JavaScript_ibm
May 16 Javascript
JavaScript高级程序设计(第3版)学习笔记9 js函数(下)
Oct 11 Javascript
node.js中的fs.writeSync方法使用说明
Dec 15 Javascript
DOM 事件流详解
Jan 20 Javascript
c#程序员对TypeScript的认识过程
Jun 19 Javascript
Function.prototype.apply()与Function.prototype.call()小结
Apr 27 Javascript
基于jquery插件实现拖拽删除图片功能
Aug 27 Javascript
JS简单去除数组中重复项的方法
Sep 13 Javascript
JavaScript 对象详细整理总结
Sep 29 Javascript
详谈Angular 2+ 的表单(一)之模板驱动型表单
Apr 25 Javascript
使用Jenkins部署React项目的方法步骤
Mar 11 Javascript
vue实现滑动切换效果(仅在手机模式下可用)
Jun 29 Javascript
AngularJS select加载数据选中默认值的方法
Feb 28 #Javascript
基于vue-cli vue-router搭建底部导航栏移动前端项目
Feb 28 #Javascript
Vue-Router模式和钩子的用法
Feb 28 #Javascript
angularjs 获取默认选中的单选按钮的value方法
Feb 28 #Javascript
angularJS的radio实现单项二选一的使用方法
Feb 28 #Javascript
vue cli 全面解析
Feb 28 #Javascript
js实现动态改变radio状态的方法
Feb 28 #Javascript
You might like
基于PHP的简单采集数据入库程序
2014/07/30 PHP
php计算数组相同值出现次数的代码(array_count_values)
2015/01/20 PHP
PHP使用星号替代用户名手机和邮箱的实现代码
2018/02/07 PHP
JavaScript 异步调用框架 (Part 3 - 代码实现)
2009/08/04 Javascript
jWiard 基于JQuery的强大的向导控件介绍
2011/10/28 Javascript
浅析JavaScript中的类型和对象
2013/11/29 Javascript
javaScript实现滚动新闻的方法
2015/07/30 Javascript
jQuery多级手风琴菜单实例讲解
2015/10/22 Javascript
深入浅析JSON.parse()、JSON.stringify()和eval()的作用详解
2016/04/03 Javascript
JS学习之表格的排序简单实例
2016/05/16 Javascript
Javascript 5种方法实现过滤删除前后所有空格
2016/06/22 Javascript
JavaScript闭包和范围实例详解
2016/12/19 Javascript
通过BootStrap-select插件 js jQuery控制select属性变化
2017/01/03 Javascript
jQuery实现鼠标滑过预览图片大图效果的方法
2017/04/26 jQuery
vue中实现methods一个方法调用另外一个方法
2018/02/08 Javascript
vue实现同一个页面可以有多个router-view的方法
2018/09/20 Javascript
微信运维交互机器人的示例代码
2018/11/12 Javascript
VueCli3.0中集成MockApi的方法示例
2019/07/05 Javascript
jQuery实现视频展示效果
2020/05/30 jQuery
[01:14:30]TNC vs VG 2019国际邀请赛淘汰赛 胜者组赛BO3 第二场 8.20.mp4
2019/08/22 DOTA
Python的词法分析与语法分析
2013/05/18 Python
Python实现的Excel文件读写类
2015/07/30 Python
Win10+GPU版Pytorch1.1安装的安装步骤
2019/09/27 Python
python中bytes和str类型的区别
2019/10/21 Python
Selenium 滚动页面至元素可见的方法
2020/03/18 Python
PyQt5实现仿QQ贴边隐藏功能的实例代码
2020/05/24 Python
HTML5 直播疯狂点赞动画实现代码 附源码
2020/04/14 HTML / CSS
最新计算机专业自荐信
2013/10/16 职场文书
《我不是最弱小的》教学反思
2014/02/23 职场文书
关于运动会的广播稿(10篇)
2014/09/12 职场文书
小学开学典礼新闻稿
2015/07/17 职场文书
爱国主义主题班会
2015/08/14 职场文书
体育部部长竞选稿
2015/11/21 职场文书
html实现随机点名器的示例代码
2021/04/02 Javascript
深入浅析React中diff算法
2021/05/19 Javascript
Python实现Excel文件的合并(以新冠疫情数据为例)
2022/03/20 Python