JS显示下拉列表框内全部元素的方法


Posted in Javascript onMarch 31, 2015

本文实例讲述了JS显示下拉列表框内全部元素的方法。分享给大家供大家参考。具体如下:

下面的JS代码可以通过alert框显示指定下拉列表的全部元素

<!DOCTYPE html>
<html>
<head>
<script>
function getOptions()
{
var x=document.getElementById("mySelect");
var txt="All options: ";
var i;
for (i=0;i<x.length;i++)
 {
 txt=txt + "\n" + x.options[i].text;
 }
alert(txt);
}
</script>
</head>
<body>
<form>
Select your favorite fruit:
<select id="mySelect">
 <option>Apple</option>
 <option>Orange</option>
 <option>Pineapple</option>
 <option>Banana</option>
</select>
<br><br>
<input type="button" onclick="getOptions()"
value="Output all options">
</form>
</body>
</html>

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

Javascript 相关文章推荐
JavaScipt基本教程之JavaScript语言的基础
Jan 16 Javascript
js内存泄露的几种情况详细探讨
May 31 Javascript
完美实现八种js焦点轮播图(上篇)
Jul 18 Javascript
javascript中的 object 和 function小结
Aug 14 Javascript
详解Angular2中的编程对象Observable
Sep 17 Javascript
详解js中Number()、parseInt()和parseFloat()的区别
Dec 20 Javascript
Bootstrap表单控件学习使用
Mar 07 Javascript
JS加密插件CryptoJS实现AES加密操作示例
Aug 16 Javascript
利用Angular2的Observables实现交互控制的方法
Dec 27 Javascript
原生JS实现九宫格抽奖
Sep 13 Javascript
原生js中运算符及流程控制示例详解
Jan 05 Javascript
Element-ui 自带的两种远程搜索(模糊查询)用法讲解
Jan 29 Javascript
JS动态改变表格边框宽度的方法
Mar 31 #Javascript
60行js代码实现俄罗斯方块
Mar 31 #Javascript
JS动态修改表格cellPadding和cellSpacing的方法
Mar 31 #Javascript
js实现的牛顿摆效果
Mar 31 #Javascript
JS动态显示表格上下frame的方法
Mar 31 #Javascript
JS实现控制表格只显示行边框或者只显示列边框的方法
Mar 31 #Javascript
jQuery选择器源码解读(八):addCombinator函数
Mar 31 #Javascript
You might like
php邮箱地址正则表达式验证
2015/11/13 PHP
zend framework中使用memcache的方法
2016/03/04 PHP
Jquery 1.42 checkbox 全选和反选代码
2010/03/27 Javascript
javascript利用初始化数据装配模版的实现代码
2010/11/17 Javascript
javascript object array方法使用详解
2012/12/03 Javascript
javascript控制在光标位置插入文字适合表情的插入
2014/06/09 Javascript
技术男用来对妹子表白的百度首页
2014/07/23 Javascript
深入对Vue.js $watch方法的理解
2017/03/20 Javascript
react-native DatePicker日期选择组件的实现代码
2017/09/12 Javascript
webpack搭建vue 项目的步骤
2017/12/27 Javascript
vue todo-list组件发布到npm上的方法
2018/04/04 Javascript
微信小程序开发之自定义tabBar的实现
2018/09/06 Javascript
vue服务端渲染页面缓存和组件缓存的实例详解
2018/09/18 Javascript
jQuery无冲突模式详解
2019/01/17 jQuery
微信小程序 flexbox layout快速实现基本布局的解决方案
2020/03/24 Javascript
仿照Element-ui实现一个简易的$message方法
2020/09/14 Javascript
[01:09]2014DOTA2国际邀请赛 TI4西雅图DOTA2 中国美女coser加油助威
2014/07/20 DOTA
[02:59]2014DOTA2西雅图国际邀请赛 圆满落幕中国夺冠
2014/07/23 DOTA
python计算对角线有理函数插值的方法
2015/05/07 Python
基于进程内通讯的python聊天室实现方法
2015/06/28 Python
Python3.4实现从HTTP代理网站批量获取代理并筛选的方法示例
2017/09/26 Python
利用python批量修改word文件名的方法示例
2017/10/17 Python
python 批量解压压缩文件的实例代码
2019/06/27 Python
Pycharm中安装wordcloud等库失败问题及终端通过pip安装的Python库如何添加到Pycharm解释器中(推荐)
2020/05/10 Python
简单几步用纯CSS3实现3D翻转效果
2019/01/17 HTML / CSS
linux面试题参考答案(11)
2012/05/01 面试题
绩效管理实施方案
2014/03/19 职场文书
研究生毕业自我鉴定范文
2014/03/27 职场文书
目标责任书格式
2014/07/28 职场文书
行政前台岗位职责
2015/04/16 职场文书
复兴之路观后感3000字
2015/06/02 职场文书
社区志愿服务活动感想
2015/08/07 职场文书
教务处教学工作总结
2015/08/10 职场文书
如何使用Python实现一个简易的ORM模型
2021/05/12 Python
Python pygame实现中国象棋单机版源码
2021/06/20 Python
MySQL的表级锁,行级锁,排它锁和共享锁
2022/07/15 MySQL