向下拉列表添加选项

最新推荐文章于 2022-12-06 12:19:17 发布

weixin_30672019

最新推荐文章于 2022-12-06 12:19:17 发布

阅读量386

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/xuzhiyuan/p/7886217.html

版权

向下拉列表中添加选项：

（1）首先得获取到下拉列表对象；

　　var sel=document.getElementById("下拉列表id");

（2）创建下拉列表选项；创建标签使用createElement("标签");

　　var option=document.create("option");

　　option.value="添加的选项value值"；

　　option.innerHTML="添加的选项内容";

（3）将选项添加到下拉列表中；

　　sel.appendChild(option);

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 2 "http://www.w3.org/TR/html4/loose.dtd">
 3 <html>
 4 <head>
 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
 6 <title>复习</title>
 7 
 8     <script type="text/javascript">
 9 
10         
11         function addSelect(){//为下拉列表添加选项
12         
13             //1.通过id获取要添加选项的值
14             var courseName=document.getElementById("courseName").value;
15             
16             //2.通过id获取下拉列表对象
17             var sel=document.getElementById("select");
18             
19             //3.创建option
20             var option=document.createElement("option");
21             option.value=courseName;
22             option.innerHTML=courseName;
23             
24             //4.将optiont添加到下拉列表中
25             sel.appendChild(option);
26         
27         }
28     
29     </script>
30 
31 </head>
32 
33 <body>
34 
35     <input type="text" id="courseName"/>
36     <input type="button" value="添加" onclick="addSelect()"/>
37     </br>
38     <select id="select" name="course">
39         <option  value="">--请选择--</option>
40     
41     </select>
42     
43     
44 </body>
45 </html>

View Code

转载于:https://www.cnblogs.com/xuzhiyuan/p/7886217.html

weixin_30672019

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
向下拉列表添加选项

向下拉列表中添加选项：（1）首先得获取到下拉列表对象；　　var sel=document.getElementById("下拉列表id");（2）创建下拉列表选项；创建标签使用createElement("标签");　　var option=document.create("option");　　option.value="添加的选项value值"；　　option.in...
复制链接

扫一扫