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 相关文章推荐
获取JavaScript用户自定义类的类名称的代码
Mar 08 Javascript
JavaScript DOM 学习第七章 表单的扩展
Feb 19 Javascript
jQuery选择器源码解读(三):tokenize方法
Mar 31 Javascript
jQuery使用Selectator插件实现多选下拉列表过滤框(附源码下载)
Apr 08 Javascript
基于Bootstrap仿淘宝分页控件实现代码
Nov 07 Javascript
微信小程序开发之录音机 音频播放 动画实例 (真机可用)
Dec 08 Javascript
jquery dataTable 后台加载数据并分页实例代码
Jun 07 jQuery
基于node.js实现微信支付退款功能
Dec 19 Javascript
select获取下拉框的值 下拉框默认选中方法
Feb 28 Javascript
vue2.0 移动端实现下拉刷新和上拉加载更多的示例
Apr 23 Javascript
AngularJS自定义过滤器用法经典实例总结
May 17 Javascript
vue实现标签云效果的方法详解
Aug 28 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操作MongoDB基础教程(连接、新增、修改、删除、查询)
2014/03/25 PHP
理解PHP中的stdClass类
2014/04/18 PHP
php cookie工作原理与实例详解
2016/07/18 PHP
php版微信公众平台入门教程之开发者认证的方法
2016/09/26 PHP
PHP实现微信提现功能
2018/09/30 PHP
不懂JavaScript应该怎样学
2008/04/16 Javascript
JQuery为textarea添加maxlength属性的代码
2010/04/07 Javascript
jquery中dom操作和事件的实例学习 仿yahoo邮箱登录框的提示效果
2011/11/30 Javascript
js实现通用的微信分享组件示例
2014/03/10 Javascript
使用Node.js实现HTTP 206内容分片的教程
2015/06/23 Javascript
JavaScript检测并限制复选框选中个数的方法
2015/08/12 Javascript
跟我学习javascript的严格模式
2015/11/16 Javascript
jQuery实现的自定义弹出层效果实例详解
2016/09/04 Javascript
Vue.js Ajax动态参数与列表显示实现方法
2016/10/20 Javascript
使用Curl命令查看请求响应时间方法
2016/11/04 Javascript
JavaScript手风琴页面制作
2017/05/17 Javascript
jQuery上传插件webupload使用方法
2017/08/01 jQuery
深入浅析Vue.js中 computed和methods不同机制
2018/03/22 Javascript
vue.js2.0 实现better-scroll的滚动效果实例详解
2018/08/13 Javascript
JS正则表达式常见函数与用法小结
2020/04/13 Javascript
详解如何在Javascript中使用Object.freeze()
2020/10/18 Javascript
Python实现八大排序算法
2016/08/13 Python
Python爬虫实现百度图片自动下载
2018/02/04 Python
Python unittest模块用法实例分析
2018/05/25 Python
Python-Flask:动态创建表的示例详解
2019/11/22 Python
Flask模板引擎Jinja2使用实例
2020/04/23 Python
CSS3的column-fill属性对齐列内容高度的用法详解
2016/07/01 HTML / CSS
西班牙最大的在线滑板和街头服饰商店:Fillow.net
2019/04/15 全球购物
毕业生优秀推荐信
2013/11/26 职场文书
企业消防安全制度
2014/02/02 职场文书
施工工地安全标语
2014/06/07 职场文书
婚前协议书范本两则
2014/10/16 职场文书
抄袭同学作业检讨书1000字
2014/11/20 职场文书
付款承诺函范文
2015/01/21 职场文书
校长师德表现自我评价
2015/03/04 职场文书
2019求职信:应届生求职信范文
2019/04/24 职场文书