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 相关文章推荐
js+css使DIV始终居于屏幕中间 左下 左上 右上 右下的代码集合
Mar 10 Javascript
jQuery读取和设定KindEditor值的方法
Nov 22 Javascript
JS的document.all函数使用示例
Dec 30 Javascript
jquery中$.post()方法的简单实例
Feb 04 Javascript
javascript表单验证和Window详解
Dec 11 Javascript
基于jQuery仿淘宝产品图片放大镜代码分享
Jun 23 Javascript
jQuery改变form表单的action,并进行提交的实现代码
May 25 Javascript
Bootstrap入门教程一Hello Bootstrap初识
Mar 02 Javascript
javascript+css3开发打气球小游戏完整代码
Nov 28 Javascript
javascript+css实现进度条效果
Mar 25 Javascript
详解Vue 数据更新了但页面没有更新的 7 种情况汇总及延伸总结
May 28 Javascript
vue-列表下详情的展开与折叠案例
Jul 28 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
解析zend Framework如何自动加载类
2013/06/28 PHP
php中利用explode函数分割字符串到数组
2014/02/08 PHP
php基于PDO连接MSSQL示例DEMO
2016/07/13 PHP
php use和include区别总结
2019/10/13 PHP
PHP解决高并发的优化方案实例
2020/12/10 PHP
Javascript动态创建div的方法
2015/02/09 Javascript
Jquery实现仿京东商城省市联动菜单
2015/11/19 Javascript
BootStrap智能表单demo示例详解
2016/06/13 Javascript
jquery实现页面加载效果
2017/02/21 Javascript
vue.js利用Object.defineProperty实现双向绑定
2017/03/09 Javascript
js图片加载效果实例代码(延迟加载+瀑布流加载)
2017/05/12 Javascript
angular使用post、get向后台传参的问题实例
2017/05/27 Javascript
JS实现快速比较两个字符串中包含有相同数字的方法
2017/09/11 Javascript
vue2 v-model/v-text 中使用过滤器的方法示例
2019/05/09 Javascript
vue中的面包屑导航组件实例代码
2019/07/01 Javascript
Vue插槽_特殊特性slot,slot-scope与指令v-slot说明
2020/09/04 Javascript
Vue如何循环提取对象数组中的值
2020/11/18 Vue.js
微信小程序学习之自定义滚动弹窗
2020/12/20 Javascript
numpy向空的二维数组中添加元素的方法
2018/11/01 Python
Python Selenium 之关闭窗口close与quit的方法
2019/02/13 Python
Python常见数据类型转换操作示例
2019/05/08 Python
对Pytorch中Tensor的各种池化操作解析
2020/01/03 Python
python小程序之4名牌手洗牌发牌问题解析
2020/05/15 Python
Python2及Python3如何实现兼容切换
2020/09/01 Python
利用python如何实现猫捉老鼠小游戏
2020/12/04 Python
CSS3属性使网站设计增强同时不消弱可用性
2009/08/29 HTML / CSS
如果有两个类A,B,怎么样才能使A在发生一个事件的时候通知B
2016/03/12 面试题
学院领导推荐信
2013/10/30 职场文书
计算机通信工程专业毕业生推荐信
2013/12/24 职场文书
十佳大学生事迹材料
2014/01/29 职场文书
安全生产大检查方案
2014/05/07 职场文书
卫生院艾滋病宣传活动小结
2014/07/09 职场文书
城管执法人员纪律作风整顿思想汇报
2014/09/13 职场文书
项目经理岗位职责范本
2015/04/01 职场文书
为了顺利买到演唱会的票用Python制作了自动抢票的脚本
2021/10/16 Python
Win10防火墙白名单怎么设置?Win10添加防火墙白名单方法
2022/04/06 数码科技