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 相关文章推荐
javascript跑马灯悬停放大效果实现代码
Dec 12 Javascript
jquery+css+ul模拟列表菜单具体实现思路
Apr 15 Javascript
animate动画示例(泪奔的小孩)及stop和delay的使用
May 06 Javascript
把文本中的URL地址转换为可点击链接的JavaScript、PHP自定义函数
Jul 29 Javascript
jQuery不兼容input的change事件问题解决过程
Dec 05 Javascript
js 获取图像缩放后的实际宽高,位置等信息
Mar 07 Javascript
bootstrap实现的自适应页面简单应用示例
Mar 09 Javascript
vue学习笔记之vue1.0和vue2.0的区别介绍
May 17 Javascript
react.js 父子组件数据绑定实时通讯的示例代码
Sep 25 Javascript
Vue触发式全局组件构建的方法
Nov 28 Javascript
编写更好的JavaScript条件式和匹配条件的技巧(小结)
Jun 27 Javascript
浅谈vue-router路由切换 组件重用挖下的坑
Nov 01 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生成静态页面详解
2006/12/05 PHP
function.inc.php超越php
2006/12/09 PHP
php中根据某年第几天计算出日期年月日的代码
2011/02/24 PHP
PHP5中GD库生成图形验证码(有汉字)
2013/07/28 PHP
php中FTP函数ftp_connect、ftp_login与ftp_chmod用法
2014/11/18 PHP
yii实现使用CUploadedFile上传文件的方法
2015/12/28 PHP
thinkPHP中U方法加密传递参数功能示例
2018/05/29 PHP
基于ThinkPHP删除目录及目录文件函数
2020/10/28 PHP
OfflineSave离线保存代码再次发布使用说明
2007/05/23 Javascript
javascript中的float运算精度实例分析
2010/08/21 Javascript
nodejs实现黑名单中间件设计
2014/06/17 NodeJs
JavaScript操作选择对象的简单实例
2016/05/16 Javascript
jQuery处理XML文件的几种方法
2016/06/14 Javascript
angularjs实现table增加tr的方法
2018/02/27 Javascript
vue系列之requireJs中引入vue-router的方法
2018/07/18 Javascript
基于 jQuery 实现键盘事件监听控件
2019/04/04 jQuery
vue的三种图片引入方式代码实例
2019/11/19 Javascript
python列出目录下指定文件与子目录的方法
2015/07/03 Python
python中string模块各属性以及函数的用法介绍
2016/05/30 Python
安装python时MySQLdb报错的问题描述及解决方法
2018/03/20 Python
Python3.7中安装openCV库的方法
2018/07/11 Python
Python常见内置高效率函数用法示例
2018/07/31 Python
解决Python中回文数和质数的问题
2019/11/24 Python
Python基于Socket实现简易多人聊天室的示例代码
2020/11/29 Python
英国羊皮鞋类领先品牌:Just Sheepskin
2019/12/12 全球购物
软件设计的目标是什么
2016/12/04 面试题
大专生的学习自我评价
2013/12/04 职场文书
大学军训感想
2014/02/12 职场文书
自荐书范文范例
2014/02/13 职场文书
2014年社区综治工作总结
2014/11/17 职场文书
初中毕业生自我评价
2015/03/02 职场文书
幼儿园庆元旦主持词
2015/07/06 职场文书
2016年领导干部正风肃纪心得体会
2015/10/09 职场文书
2016年万圣节活动个人总结
2016/04/05 职场文书
python基于opencv批量生成验证码的示例
2021/04/28 Python
用Python将GIF动图分解成多张静态图片
2021/06/11 Python