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使用cookie
Feb 02 Javascript
jquery 常用操作整理 基础入门篇
Oct 14 Javascript
js中创建对象的几种方式示例介绍
Jan 26 Javascript
Node.js中使用Log.io在浏览器中实时监控日志(等同tail -f命令)
Sep 17 Javascript
JavaScript基础篇(6)之函数表达式闭包
Dec 11 Javascript
jQuery validate 验证radio实例
Mar 01 Javascript
利用ES6语法重构React组件详解
Mar 02 Javascript
JS跳转手机站url的若干注意事项
Oct 18 Javascript
微信小程序使用wx.request请求服务器json数据并渲染到页面操作示例
Mar 30 Javascript
简单学习5种处理Vue.js异常的方法
Jun 17 Javascript
vue动画—通过钩子函数实现半场动画操作
Aug 09 Javascript
vue form表单post请求结合Servlet实现文件上传功能
Jan 22 Vue.js
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 empty函数 使用说明
2009/08/10 PHP
PHP将进程作为守护进程的方法
2015/03/19 PHP
PHP设置进度条的方法
2015/07/08 PHP
PHP用mysql_insert_id()函数获得刚插入数据或当前发布文章的ID
2016/11/25 PHP
php mysql PDO 查询操作的实例详解
2017/09/23 PHP
php在windows环境下获得cpu内存实时使用率(推荐)
2018/02/08 PHP
JQuery对class属性的操作实现按钮开关效果
2013/10/11 Javascript
jQuery取得select选择的文本与值的示例
2013/12/09 Javascript
14个有用的Jquery技巧分享
2015/01/08 Javascript
js获取当前日期前七天的方法
2015/02/28 Javascript
node.js操作mongodb学习小结
2015/04/25 Javascript
谈一谈JS消息机制和事件机制的理解
2016/04/14 Javascript
JavaScript中捕获/阻止捕获、冒泡/阻止冒泡方法
2016/12/07 Javascript
js实现省份下拉菜单效果
2017/02/15 Javascript
说说Vue.js中的functional函数化组件的使用
2019/02/12 Javascript
使用React手写一个对话框或模态框的方法示例
2019/04/25 Javascript
配置一个vue3.0项目的完整步骤
2019/04/26 Javascript
Node.js fs模块(文件模块)创建、删除目录(文件)读取写入文件流的方法
2019/09/03 Javascript
jQuery与原生JavaScript选择HTML元素集合用法对比分析
2019/11/26 jQuery
部署vue+Springboot前后端分离项目的步骤实现
2020/05/31 Javascript
[43:48]Ti4正赛第一天 VG vs NEWBEE 2
2014/07/19 DOTA
Django框架多表查询实例分析
2018/07/04 Python
django框架面向对象ORM模型继承用法实例分析
2019/07/29 Python
python针对mysql数据库的连接、查询、更新、删除操作示例
2019/09/11 Python
解决pandas展示数据输出时列名不能对齐的问题
2019/11/18 Python
pytorch进行上采样的种类实例
2020/02/18 Python
python中round函数如何使用
2020/06/19 Python
python使用smtplib模块发送邮件
2020/12/17 Python
简单整理HTML5的基本特性和语法
2016/02/18 HTML / CSS
提高EJB性能都有哪些技巧
2012/03/25 面试题
优秀的毕业生的自我评价
2013/12/12 职场文书
毕业生就业协议书
2014/04/11 职场文书
大学理论知识学习自我鉴定
2014/04/28 职场文书
学校食堂食品安全责任书
2014/07/28 职场文书
我心目中的好老师活动方案
2014/08/19 职场文书
工作疏忽、懈怠的检讨书
2014/09/11 职场文书