zoukankan      html  css  js  c++  java
  • 向下拉列表添加选项

    向下拉列表中添加选项:

    (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
  • 相关阅读:
    每日一题_191208
    每日一题_191207
    每日一题_191206
    每日一题_191205
    每日一题_191204
    每日一题_191203
    每日一题_191202
    每日一题_191201
    每日一题_191130
    2020届成都一诊理科16题
  • 原文地址:https://www.cnblogs.com/xuzhiyuan/p/7886217.html
Copyright © 2011-2022 走看看