PHP MySql JS及select中的onchange使用

我想实现一个这样子的功能，但是要跟MYSQL数据库有互动，涉及到select中的onchange问题。
问题：
<form>
<select name="AreaID" style="width:100%" size="15" onchange="showUnversity(this.options[this.selectedIndex].value);">
<option value="5">+ 黑龙江</option>
<option value="6">+ 吉林</option>
<option value="7">+ 辽宁</option>
<option value="8">+ 山东</option>
</select>
<span id="AreaID1"></span>
</form>
我想要的结果：（比如点了黑龙江）
<form>
<select name="AreaID" style="width:100%" size="15" onchange="showUnversity(this.options[this.selectedIndex].value);">
<option value="5">齐齐哈尔市</option>
<option value="6">牡丹市</option>
<option value="7">大庆市</option>
<option value="8">伊春市</option>
</select>
<span id="AreaID1"></span>
</form>我想说点了黑龙江之后，从数据库读取出黑龙江各个市的名称，然后还是显示在同一个地方（如图）。初学者，试了好久没试出来，给个详细用例学习下，十分感谢！
mysqlphp数据库

解决方案 »

  1.   

    知识要点ajax js mysqlorjquery ajax mysql 
      

  2.   

    <!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 language="javascript">
    countries=["中国","美国","英国"];
    //中国省、直辖市
    countries["中国"]=['北京', '上海', '重庆', '广东', '湖北', '浙江','湖南','新疆','西藏'];
    //美国
    countries["美国"]=['华盛顿', '纽约', '拉斯维加斯', '底特律', '夏威夷', '洛杉矶', '丹佛', '休斯敦'];
    //英国
    countries["英国"]=['伦敦', '曼彻斯特', '利兹', '纽卡斯尔', '伯明翰'];//广东省下的市
    countries["中国"]["广东"]=['广州','东莞','惠州'];
    //湖北省下的市
    countries["中国"]["湖北"]=['鄂州','宜昌','武汉','荆州','荆门','黄石','襄樊'];
    //浙江省下的市
    countries["中国"]["浙江"]=['杭州','温州','金华','义乌','宁波'];
    //湖南省下的市
    countries["中国"]["湖南"]=['岳阳','湘潭','长沙'];function show_p(thisCountry)
    {
    document.getElementById("city").innerHTML="";
    document.getElementById("province").innerHTML="";
    if(thisCountry!="")
    {
    var p="";
    for(i=0;i<countries[thisCountry].length;i++)
    {
    p+="<option value='"+countries[thisCountry][i]+"'>"+countries[thisCountry][i]+"</option>";
    }

    document.getElementById("province").innerHTML="<select onchange=showC('"+thisCountry+"',this.value)>"+p+"</select>";
    }
    else
    document.getElementById("province").innerHTML="";
    }function showC(thisCountry,thisP)
    {
    document.getElementById("city").innerHTML="";
    var c="";
    for(i=0;i<countries[thisCountry][thisP].length;i++)
    {
    c+="<option>"+countries[thisCountry][thisP][i]+"</option>";
    }

    document.getElementById("city").innerHTML="<select>"+c+"</select>";
    }
    </script>
    </head><body>
    请选择国家：
    <select id="country" onchange="show_p(this.value)">
    <option value="">请选择国家</option>
    <script language="javascript">
    for(i=0;i<countries.length;i++)
    document.write("<option value='"+countries[i]+"'>"+countries[i]+"</option>");
    </script>
    </select>
    <span id="province"></span>
    <span id="city"></span>
    </body>
    </html>
    可以参考下