javascript生成下拉列表

如何用javascript生成一个下拉列表，请给一个详细的例子

解决方案 »

  1.   

    第一种（和第二种差不多）：<html>
    <head>
    <script type="text/javascript">
    function insertOption()
      {
      var y=document.createElement('option');
      y.text='Kiwi'
      var x=document.getElementById("mySelect");
      try
        {
        x.add(y,null); // standards compliant
        }
      catch(ex)
        {
        x.add(y); // IE only
        }
      }
    </script>
    </head>
    <body><form>
    <select id="mySelect">
      <option>Apple</option>
      <option>Pear</option>
      <option>Banana</option>
      <option>Orange</option>
    </select>
    <input type="button" onclick="insertOption()"
    value="Insert option" />
    </form></body>
    </html>
      

  2.   

    <select id="select"></select>
    <input type="button" value="添加列表" onclick="addOption()">
    <script type="text/javascript">
    var i = 0;function addOption(){
    ++i;
    var select = document.getElementById("select");
    var option = document.createElement('option');
    option.id = 'option' + i;
    option.text = 'option' + i;
    try{
    select.add(option, null); //标准
    }catch(ex){
    select.add(option); //IE
    }
    if(i > 1)document.getElementById("option" + (i - 1)).selected = false;
    document.getElementById("option" + i).selected = true;
    }
    </script>
      

  3.   


    <?phpheader('Content-Type: text/html; charset=gb2312'); ?>
    <html><head>
    <script type="text/javascript" src="/Script/jquery-1.4.2.js">
    </script>
    <script language="javascript" type="text/javascript">
    function funfun()
    {
    var tmp=document.getElementById("kk");
    var selectstr="<select><option>aaa</option><option>bbb</option></select>";
    tmp.innerHTML=selectstr;
    }</script>
    </head>
    <body>
    <div id="kk"></div><input type="button" value="tijiao" onclick="javascript:funfun();"></body>
    </html>