下拉框值添加问题、

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
function $(id){
    return document.getElementById(id);
}
function del(wen1){
    var wen2 = $("wen2");
    wen2.options.length = 0;
    for(var i = wen1.selectedIndex; i < wen1.options.length; i++){        if(!wen1.options[i].selected){
            wen2.options.add(new Option(wen1.options[i].innerHTML, wen1.options[i].value));
        }
    }
}
window.onload = function(){
    del($("wen1"));
};
</script>
<style type="text/css">
<!--
.STYLE1 {color: #FF0000}
-->
</style>
</head><body style="font-size:12px">
<p>
  列表1：
    <select name="wen1" id="wen1" onchange="del(this)">
    <option value="1">1月</option>
<option value="2">2月</option>
<option value="3">3月</option>
<option value="4">4月</option>
<option value="5">5月</option>
<option value="6">6月</option>
<option value="7">7月</option>
<option value="8">8月</option>
<option value="9">9月</option>
<option value="10">10月</option>
<option value="11">11月</option>
<option value="12">12月</option>
  </select>
列表2：
<select name="wen2" id="wen2">
    <option value="1">1月</option>
<option value="2">2月</option>
<option value="3">3月</option>
<option value="4">4月</option>
<option value="5">5月</option>
<option value="6">6月</option>
<option value="7">7月</option>
<option value="8">8月</option>
<option value="9">9月</option>
<option value="10">10月</option>
<option value="11">11月</option>
<option value="12">12月</option>
</select>
<p>现在我有两个下拉列表，<span class="STYLE1">列表1</span>和<span class="STYLE1">列表2</span>。
<p>目前我实现了，选择<span class="STYLE1">列表1</span>的值的时候<span class="STYLE1">列表2</span>里相同和以上的值被移除。
<p>现在我想要实现，当我选择<span class="STYLE1">列表1</span>的值的时候<span class="STYLE1">列表2</span>里相同以上的值被移除，而且<span class="STYLE1">相同的值以上的值同样被移除</span>。
<p>如：
<p>当<span class="STYLE1">列表1</span>我选择<span class="STYLE1">3月</span><p>那么<span class="STYLE1">列表2</span>里面的值应该：    
<p><br />
  &lt;option value=&quot;4&quot;&gt;4月&lt;/option&gt;<br />
  &lt;option value=&quot;5&quot;&gt;5月&lt;/option&gt;<br />
  &lt;option value=&quot;6&quot;&gt;6月&lt;/option&gt;<br />
  &lt;option value=&quot;7&quot;&gt;7月&lt;/option&gt;<br />
  &lt;option value=&quot;8&quot;&gt;8月&lt;/option&gt;<br />
  &lt;option value=&quot;9&quot;&gt;9月&lt;/option&gt;<br />
  &lt;option value=&quot;10&quot;&gt;10月&lt;/option&gt;<br />
  &lt;option value=&quot;11&quot;&gt;11月&lt;/option&gt;<br />
  &lt;option value=&quot;12&quot;&gt;12月&lt;/option&gt;<br />
&lt;option value=&quot;M1&quot;&gt;明年1月&lt;/option&gt;<br />
&lt;option value=&quot;M2&quot;&gt;明年2月&lt;/option&gt;<br />
&lt;option value=&quot;M3&quot;&gt;明年3月&lt;/option&gt;
<p>
</body>
</html>
麻烦各位了、

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <script type="text/javascript">
    function $(id){
        return document.getElementById(id);
    }
    function del(wen1){
        var wen2 = $("wen2");
        wen2.options.length = 0;
        for(var i = wen1.selectedIndex; i < wen1.options.length; i++){        if(!wen1.options[i].selected){
                wen2.options.add(new Option(wen1.options[i].innerHTML, wen1.options[i].value));
            }
        }
        //只需要加上这个就OK了
        for(var i=1;i<wen1.selectedIndex+2;i++){
         wen2.add(new Option("M"+i,"明年"+i+"月"));
        }
    }
    window.onload = function(){
        del($("wen1"));
    };
    </script>
    <style type="text/css">
    <!--
    .STYLE1 {color: #FF0000}
    -->
    </style>
    </head><body style="font-size:12px">
    <p>
      列表1：
        <select name="wen1" id="wen1" onchange="del(this)">
        <option value="1">1月</option>
        <option value="2">2月</option>
        <option value="3">3月</option>
        <option value="4">4月</option>
        <option value="5">5月</option>
        <option value="6">6月</option>
        <option value="7">7月</option>
        <option value="8">8月</option>
        <option value="9">9月</option>
        <option value="10">10月</option>
        <option value="11">11月</option>
        <option value="12">12月</option>
      </select>
    列表2：
    <select name="wen2" id="wen2">
        <option value="1">1月</option>
        <option value="2">2月</option>
        <option value="3">3月</option>
        <option value="4">4月</option>
        <option value="5">5月</option>
        <option value="6">6月</option>
        <option value="7">7月</option>
        <option value="8">8月</option>
        <option value="9">9月</option>
        <option value="10">10月</option>
        <option value="11">11月</option>
        <option value="12">12月</option>
    </select>
    <p>现在我有两个下拉列表，<span class="STYLE1">列表1</span>和<span class="STYLE1">列表2</span>。
    <p>目前我实现了，选择<span class="STYLE1">列表1</span>的值的时候<span class="STYLE1">列表2</span>里相同和以上的值被移除。
    <p>现在我想要实现，当我选择<span class="STYLE1">列表1</span>的值的时候<span class="STYLE1">列表2</span>里相同以上的值被移除，而且<span class="STYLE1">相同的值以上的值同样被移除</span>。
    <p>如：
    <p>当<span class="STYLE1">列表1</span>我选择<span class="STYLE1">3月</span><p>那么<span class="STYLE1">列表2</span>里面的值应该：    
    <p><br />
      &lt;option value=&quot;4&quot;&gt;4月&lt;/option&gt;<br />
      &lt;option value=&quot;5&quot;&gt;5月&lt;/option&gt;<br />
      &lt;option value=&quot;6&quot;&gt;6月&lt;/option&gt;<br />
      &lt;option value=&quot;7&quot;&gt;7月&lt;/option&gt;<br />
      &lt;option value=&quot;8&quot;&gt;8月&lt;/option&gt;<br />
      &lt;option value=&quot;9&quot;&gt;9月&lt;/option&gt;<br />
      &lt;option value=&quot;10&quot;&gt;10月&lt;/option&gt;<br />
      &lt;option value=&quot;11&quot;&gt;11月&lt;/option&gt;<br />
      &lt;option value=&quot;12&quot;&gt;12月&lt;/option&gt;<br />
    &lt;option value=&quot;M1&quot;&gt;明年1月&lt;/option&gt;<br />
    &lt;option value=&quot;M2&quot;&gt;明年2月&lt;/option&gt;<br />
    &lt;option value=&quot;M3&quot;&gt;明年3月&lt;/option&gt;
    <p>
    </body>
    </html>
      

  2.   

    wen2.add(new Option("M"+i,"明年"+i+"月"));
    =====>
    wen2.add(new Option("明年"+i+"月","M"+i));
      

  3.   

    是哦，再添加一次就可以了嘛、
    我晕咧，
    多谢帅多、thanks