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 相关文章推荐
借用Google的Javascript API Loader来加速你的网站
Jan 28 Javascript
javascript call方法使用说明
Jan 11 Javascript
javascript 简单抽屉效果的实现代码
Mar 09 Javascript
JSON 教程 json入门学习笔记
Sep 22 Javascript
jquery插件之定时查询待处理任务数量
May 01 Javascript
js设置控件的隐藏与显示的两种方法
Aug 21 Javascript
详解Node 定时器
Feb 26 Javascript
JS判断数组里是否有重复元素的方法小结
May 21 Javascript
Vue-cli3.X使用px2 rem遇到的问题及解决方法
Aug 08 Javascript
微信小程序绑定手机号获取验证码功能
Oct 22 Javascript
js实现金山打字通小游戏
Jul 24 Javascript
JavaScript实现筛选数组
Mar 02 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/07/16 PHP
PHP将Excel导入数据库及数据库数据导出至Excel的方法
2015/06/24 PHP
YII Framework框架教程之使用YIIC快速创建YII应用详解
2016/03/15 PHP
php页面跳转session cookie丢失导致不能登录等问题的解决方法
2016/12/12 PHP
jQuery 使用手册(四)
2009/09/23 Javascript
jQueryUI如何自定义组件实现代码
2010/11/14 Javascript
浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法
2014/01/10 Javascript
通过url查找a元素应用案例
2014/04/29 Javascript
Vuejs第十篇之vuejs父子组件通信
2016/09/06 Javascript
微信小程序 生命周期详解
2016/10/12 Javascript
第一次接触神奇的Bootstrap
2016/10/14 Javascript
详解微信小程序 wx.uploadFile 的编码坑
2017/01/23 Javascript
js事件冒泡与事件捕获详解
2017/02/20 Javascript
动态加载权限管理模块中的Vue组件
2018/01/16 Javascript
详解angular路由高亮之RouterLinkActive
2018/04/28 Javascript
详解基于mpvue的小程序markdown适配解决方案
2018/05/08 Javascript
vue实现微信分享功能
2018/11/28 Javascript
详解element-ui中form验证杂记
2019/03/04 Javascript
简单了解JS打开url的方法
2020/02/21 Javascript
nuxt 服务器渲染动态设置 title和seo关键字的操作
2020/11/05 Javascript
vue打开其他项目页面并传入数据详解
2020/11/25 Vue.js
[03:43]TI9战队采访——PSG.LGD
2019/08/22 DOTA
pycharm 使用心得(二)设置字体大小
2014/06/05 Python
10款最好的Web开发的 Python 框架
2015/03/18 Python
全面了解Nginx, WSGI, Flask之间的关系
2018/01/09 Python
使用python读取.text文件特定行的数据方法
2019/01/28 Python
孕妇内衣和胸罩:Cake Maternity
2018/07/16 全球购物
Superdry极度干燥美国官网:英国制造的服装品牌
2018/11/13 全球购物
写自荐信的注意事项
2014/03/09 职场文书
《她是我的朋友》教学反思
2014/04/26 职场文书
酒店管理专业自荐信
2014/05/23 职场文书
平安建设工作方案
2014/06/02 职场文书
解放思想演讲稿
2014/09/11 职场文书
2014高中生入党思想汇报范文
2014/09/13 职场文书
Python中的np.argmin()和np.argmax()函数用法
2021/06/02 Python