js实现下拉列表选中某个值的方法(3种方法)


Posted in Javascript onDecember 17, 2015

本文实例讲述了js实现下拉列表选中某个值的方法。分享给大家供大家参考,具体如下:

方法1:

<select id="aa">
<option>1</option>
<option>2</option>
</select>
<input type="button" value=" 选中" onclick="checkOption()" />
<script language="javascript" type="text/javascript" >
function checkOption()
{
 document.getElementById("aa").options[1].selected = true;
 alert("选中了2");
}
</script>

方法2:

有一个如下的drop down

<select name="" >
<option value="1">11</option>
<option value="2">22</option>
<option value="3">33</option>
.......

不在表单之内的下拉列表框mycombo的操作

document.all( "mycombo ").selectedIndex=2 // 成功选中“苹果”这一项
mycombo.selectedIndex=2 // 成功选中“苹果”这一项 
document.mycombo.selectedIndex=2 // 失败

在表单myform之内的下拉列表框combo2的操作

document.all( "combo2 ").selectedIndex=2 // 成功选中“买水果”这一项
myform.combo2.selectedIndex=2 // 成功选中“买水果”这一项 
document.myform.combo2.selectedIndex=2 // 成功选中“买水果”这一项

方法3:

可以通过value来赋值。

举例如下:

下拉列表代码如下:

<select onPropertyChange="showValue(this.value)" id="mysel">
 <option value=""></option>
 <option value="1">1</option>
 <option value="2">2</option>
 <option value="3">3</option>
</select>
<input type="button" value="changevalue" onclick="setvalue();">

JS函数代码如下:

function setvalue() {
 document.getElementById("mysel").value="2";
}

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
解决 FireFox 下[使用event很麻烦] 的问题.
Aug 22 Javascript
CCPry JS类库 代码
Oct 30 Javascript
JQuery中$之选择器用法介绍
Apr 05 Javascript
js禁止页面刷新与后退的方法
Jun 08 Javascript
AngularJS Module方法详解
Dec 08 Javascript
jQuery实现的导航动画效果(附demo源码)
Apr 01 Javascript
JavaScript实现简单的星星评分效果
May 18 Javascript
JS实现多物体运动的方法详解
Jan 23 Javascript
vue-infinite-loading2.0 中文文档详解
Apr 08 Javascript
如何从零开始利用js手写一个Promise库详解
Apr 19 Javascript
如何使用pm2快速将项目部署到远程服务器
Mar 12 Javascript
npm的lock机制解析
Jun 20 Javascript
详解js图片轮播效果实现原理
Dec 17 #Javascript
js和jquery分别验证单选框、复选框、下拉框
Dec 17 #Javascript
jQuery+CSS实现滑动的标签分栏切换效果
Dec 17 #Javascript
JS禁用页面上所有控件的实现方法(附demo源码下载)
Dec 17 #Javascript
jQuery选择器用法实例详解
Dec 17 #Javascript
深入分析jQuery的ready函数是如何工作的(工作原理)
Dec 17 #Javascript
js倒计时简单实现方法
Dec 17 #Javascript
You might like
PHP中调用JAVA
2006/10/09 PHP
利用PHP生成静态HTML文档的原理
2012/10/29 PHP
php检测网页是否被百度收录的函数代码
2013/10/09 PHP
php实现简单的上传进度条
2015/11/17 PHP
PHP+RabbitMQ实现消息队列的完整代码
2019/03/20 PHP
PHP判断当前使用的是什么浏览器(推荐)
2019/10/27 PHP
PHP pthreads v3下worker和pool的使用方法示例
2020/02/21 PHP
表单(FORM)的一些实用效果代码
2007/03/25 Javascript
javascript 类方法定义还是有点区别
2009/04/15 Javascript
js滚动条回到顶部的代码
2011/12/06 Javascript
javascript随机将第一个dom中的图片添加到第二个div中示例
2013/10/08 Javascript
Extjs改变树节点的勾选状态点击按钮将复选框去掉
2013/11/14 Javascript
jQuery消息提示框插件Tipso
2015/05/04 Javascript
JavaScript学习笔记之检测客户端类型是(引擎、浏览器、平台、操作系统、移动设备)
2015/12/03 Javascript
JavaScript过滤字符串中的中文与空格方法汇总
2016/03/07 Javascript
值得分享和收藏的Bootstrap学习教程
2016/05/12 Javascript
javascript循环链表之约瑟夫环的实现方法
2017/01/16 Javascript
详解Vue生命周期的示例
2017/03/10 Javascript
webpack 模块热替换原理
2018/04/09 Javascript
在vue中解决提示警告 for循环报错的方法
2018/09/28 Javascript
Vue.js中 v-model 指令的修饰符详解
2018/12/03 Javascript
如何基于JavaScript判断图片是否加载完成
2019/12/28 Javascript
[03:17]史诗级大片应援2018DOTA2国际邀请赛 致敬每一位坚守遗迹的勇士
2018/07/20 DOTA
[01:08:43]DOTA2-DPC中国联赛定级赛 Phoenix vs DLG BO3第一场 1月9日
2021/03/11 DOTA
python使用pandas实现数据分割实例代码
2018/01/25 Python
Python 循环语句之 while,for语句详解
2018/04/23 Python
浅谈spring boot 集成 log4j 解决与logback冲突的问题
2020/02/20 Python
python如何设置静态变量
2020/09/07 Python
美国领先的男士和女士内衣购物网站:Freshpair
2019/02/25 全球购物
波兰汽车配件网上商店:iParts.pl
2020/09/08 全球购物
如何选择使用结构还是类
2014/05/30 面试题
秋季红领巾广播稿
2014/01/27 职场文书
投标人法定代表人授权委托书格式
2014/09/28 职场文书
2015年小学体育工作总结
2015/05/22 职场文书
运动会加油稿
2015/07/22 职场文书
Win11安全功能升级:内置防网络钓鱼功能
2022/04/08 数码科技