首先祝您中秋节快乐!
我想实现:网页上有可同时输入也可下拉列表选择的框,还有Save和Delete按钮各一个,欲在文本框中输入一串字符后,点击Save按钮,这串字符出现在下拉列表中,选择下拉列表中某项后,点击Delete把它删除掉。
我是个新手,有谁做过类似的东西,麻烦您传一下代码,我研究研究。谢谢您!

解决方案 »

  1.   

    增加:
    var opt=document.getElementById('xxx');
    opt.options[opt.options.length]=new Option('xxx','xxx');删除:for(var i=0;i<opt.options.length;i++){
      if(opt.options[i].value==opt.value)opt.options.remove(i);
    }
      

  2.   

    给段代码,楼主参考一下:javascript:
    ------------
    //添加选项
    function Save()
    {
    var select = document.getElementById("s1");  //对<select>的引用

    var val = document.getElementById("opt").value;//要添加到选项中的字符串
    if (val == "")
    {
    alert("请输入字符");
    return;
    }

    //添加
    select.options[select.options.length] = new Option(val, val);
    document.getElementById("opt").value = "";
    }//删除选项
    function Delete()
    {
    var select = document.getElementById("s1");  //<select>
    if (select.selectedIndex > -1)
    select.options[select.selectedIndex] = null; //删除
    }
    html:
    ---------------
    <select id="s1"></select><br />
    <input type="text" id="opt" />
    <input type="button" id="save" value="Save" onclick="Save()" />
    <input type="button" id="delete" value="Delete" onclick="Delete()" />
      

  3.   

    谢谢大家!
    在你们的基础上实现了效果,我做了修改,结果是这样的。下面是源代码:
    然而,我想在输入字符串Save前想提醒一下下拉列表框中是否覆盖,在我的代码中for 循环的部分,但是实现不了,请指点一二。
    <html>
    <head>
      <title>测试下拉表单</title>
      <script   language="JavaScript">
    function Save()
       {
        var select = document.getElementById("s1");  //对<select>的引用
        var val = document.getElementById("opt").value;//要添加到选项中的字符串
        var length=select.options.length;              //下拉选项的长度
        if (val == "")
          {                                                                         //得判断一下下拉列表中是否存在
           alert("Please input a profile name.");
           return;
          }
                                                                                    //查找下拉列表中是否存在相同的配置文件
          for(flag="0";flag<length;flag++)
          {
            if(val==select.options[flag])
            {
             if(!confirm("Could you cover the existing profile?")) return;
            }
          }
    //添加
        select.options[length] = new Option(val, val);
        document.getElementById("opt").value = "";
       }
    //删除选项
    function Delete()
       {
        opt.value="";
        var select = document.getElementById("s1");  //<select>
        var val=select.value;                        //要删除的字符串
        if (val == "")
          {
           alert("Please select a profile name.");
           return;
          }
        if (val == "Default")
          {
           alert("The default profile can not be deleted!");
           return;
          }
        if (select.selectedIndex > -1)
        select.options[select.selectedIndex] = null;//删除   }
    </script>
    </head>
    <body>    <input id="opt" type=text name=save style="width:200px;"><span style="width:18px;">
          <select id="s1" style="margin-left:-100px;width:118px;"  onchange=opt.value=this.value>
          <option value="" selected>--Please Select--</option>
          <option  value=Default>Default
        <select>
       </span>
    <input type="submit" id="save" value="Save" onclick="Save()" />
    <input type="submit" id="delete" value="Delete" onclick="Delete()" /></body>
    </html>
      

  4.   

    哦,调试成功了,谢谢大家!直接运行代码可以看到结果。var flag=0                                                                    //查找下拉列表中是否存在相同的配置文件
         for(flag=0;flag<length;flag++)
          {
            if(val==select.options[flag].value)
            {
             confirm("Could you cover the existing profile?");
             document.getElementById("opt").value = "";
             return;
            }
          }