由一个dropdown决定另一个dropdowm的内容[急急急急急急急急急！！！！！！]

<table>
    <tr>
        <td>Country</td>
        <td>
            <select name="country" multiple="true" size="3">
              <option value="-">--Please Select</option>
              <option id="1" value="AT">Austria</option>
              <option id="2" value="UK">United Kingdom</option>
              <option id="3" value="US">United States</option>
              <option id="4" value="DE">Germany</option>
              <option id="6" value="IT">Italy</option>
              <option id="7" value="PRC">China</option>
          </select>
          <td>City</td>
          <td>
            <select name="city">
          </select>
        </td>
    </tr>
</table>
比如一个Country由多个城市，可以选择多个country,然后选中的country的city全部显示在city的dropdowm

解决方案 »

  1.   

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" />
    <script type="text/javascript">
            function ChangeProvince(province_id, ddlname)
            {          
                var ddlcity = "#"+ ddlname;
                $(ddlcity).empty();
                $(ddlcity).prepend("<option value=''>请选择-市/区-</option>");
                $.each(cityarray, function(i,item){                
                    if(item[1] == province_id)                   
                        $(ddlcity).append("<option value='"+item[2]+"'>"+item[0]+"</option>"); 
                });
                $(ddlcity)[0].selectedIndex = 0;
            }
    </script>
    <select name="country" multiple="true" size="3" onchange="ChangeProvince(this.options[this.selectedIndex].value, 'city')">
      <option value="-">--Please Select</option>
      <option id="1" value="AT">Austria</option>
      <option id="2" value="UK">United Kingdom</option>
      <option id="3" value="US">United States</option>
      <option id="4" value="DE">Germany</option>
      <option id="6" value="IT">Italy</option>
      <option id="7" value="PRC">China</option>
    </select>
    <!--加上个id-->
    <select name="city" id="city">
    </select>
      

  2.   

    http://blog.csdn.net/hch126163/archive/2010/12/07/6059906.aspx
      

  3.   

    <select name="city" id="city">
    </select>JS中需要个数组：
    用循环输出来
    cityarray[i] = new Array("城市名称","省份ID","城市ID");
      

  4.   

    $(ddlcity).apend("<option value='3'>城市3</option>");
    这样是往城市里添加一个选项
      

  5.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">
      <script type="text/javascript">
    var tj={
    "AT":["AT1","AT2","AT3"],
    "UK":["UK1","UK2","UK3"],
    "US":["US1","US2","US3"],
    "DE":["DE1","DE2","DE3"],
    "IT":["IT1","IT2","IT3"],
    "PRC":["PRC1","PRC2","PRC3"]
    } function ch()
    {
    var cs=document.getElementById("country");
    var ct=document.getElementById("city");
    ct.options.length=0;
    var ops=[];
    for(var i=0;i<cs.options.length;i++)
    {
    if(cs.options[i].selected)
    {
    ops.push(cs.options[i].value);
    }
    }

    for(var j=0;j<ops.length;j++)
    {
    var tv=ops[j];
    var ta=tj[tv]||[];
    for(var k=0;k<ta.length;k++)
    {
    var op=document.createElement("option");
    op.value=ta[k];
    op.innerHTML=ta[k];
    ct.appendChild(op);
    }
    }
    }
      </script>
     </HEAD> <BODY>
      <table>
      <tr>
      <td>Country</td>
      <td>
      <select id="country" name="country" multiple="true" size="3" onchange="ch()">
      <option value="-">--Please Select</option>
      <option id="1" value="AT">Austria</option>
      <option id="2" value="UK">United Kingdom</option>
      <option id="3" value="US">United States</option>
      <option id="4" value="DE">Germany</option>
      <option id="6" value="IT">Italy</option>
      <option id="7" value="PRC">China</option>
      </select>
      <td>City</td>
      <td>
    <select id="city" name="city">
    </select>
      </td>
      </tr>
     </table>
     </BODY>
    </HTML>