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 编程引入命名空间的方法与代码
Aug 13 Javascript
使用Jquery打造最佳用户体验的登录页面的实现代码
Jul 08 Javascript
js关闭模态窗口刷新父页面或跳转页面
Dec 13 Javascript
当前流行的JavaScript代码风格指南
Sep 10 Javascript
node.js中的console.log方法使用说明
Dec 09 Javascript
JS 通过系统时间限定动态添加 select option的实例代码
Jun 09 Javascript
浅谈angularjs module返回对象的坑(推荐)
Oct 21 Javascript
关于Vue.nextTick()的正确使用方法浅析
Aug 25 Javascript
详解bootstrap导航栏.nav与.navbar区别
Nov 23 Javascript
jQuery实现点击DIV同时点击CheckBox,并为DIV上背景色的实例
Dec 18 jQuery
Vue之beforeEach非登录不能访问的实现(代码亲测)
Jul 18 Javascript
Element Collapse 折叠面板的使用方法
Jul 26 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开发模式(简写版)
2007/03/15 PHP
PHP测试程序运行时间的类
2012/02/05 PHP
浅析memcache启动以及telnet命令详解
2013/06/28 PHP
php中实现记住密码下次自动登录的例子
2014/11/06 PHP
CI框架数据库查询之join用法分析
2016/05/18 PHP
PHP创建多级目录的两种方法
2016/10/28 PHP
MooTools 1.2中的Drag.Move来实现拖放
2009/09/15 Javascript
给页面渲染时间加速 干掉Dom Level 0 Event
2012/12/19 Javascript
js如何判断用户是否是用微信浏览器
2014/06/05 Javascript
简单实现Vue的observer和watcher
2016/12/21 Javascript
基于vue 添加axios组件,解决post传参数为null的问题
2018/03/05 Javascript
JS中的事件委托实例浅析
2018/03/22 Javascript
Vue源码解析之数组变异的实现
2018/12/04 Javascript
解决Vue动态加载本地图片问题
2019/10/09 Javascript
vue 解除鼠标的监听事件的方法
2019/11/13 Javascript
Nodejs 微信小程序消息推送的实现
2021/01/20 NodeJs
Python中的zipfile模块使用详解
2015/06/25 Python
Python内存管理方式和垃圾回收算法解析
2017/11/11 Python
TensorFlow saver指定变量的存取
2018/03/10 Python
使用pandas批量处理矢量化字符串的实例讲解
2018/07/10 Python
安装完Python包然后找不到模块的解决步骤
2020/02/13 Python
Python使用socketServer包搭建简易服务器过程详解
2020/06/12 Python
Python配置pip国内镜像源的实现
2020/08/20 Python
利用python为PostgreSQL的表自动添加分区
2021/01/18 Python
CSS3+js实现简单的时钟特效
2015/03/18 HTML / CSS
女子锻炼服装和瑜伽服装:Splits59
2019/03/04 全球购物
机械专业毕业生自荐信
2013/11/02 职场文书
市场营销调查计划书
2014/05/02 职场文书
党的群众路线教育实践活动个人对照检查材料(公安)
2014/11/05 职场文书
医生个人年度总结
2015/02/28 职场文书
2015年文明创建工作总结
2015/04/30 职场文书
电话营销开场白
2015/05/29 职场文书
离婚协议书范本(2016最新版)
2016/03/18 职场文书
浅谈golang 中time.After释放的问题
2021/05/05 Golang
python中24小时制转换为12小时制的方法
2021/06/18 Python
Linux7.6二进制安装Mysql8.0.27详细操作步骤
2021/11/27 MySQL