在其他下拉菜单的选择上填充下拉菜单

如果您将数据编码为JSON格式，那么您可以这样做:

HTML:

<select name='country' id='country'>
    <option value='india'>India</option>
    <option value='usa'>USA</option>
</select>
<select name='dates' id='dates'>
</select>

jQuery:

data = {
    india: ['2011-03-11','2010-02-01'],
    usa: ['2006-03-11','2009-02-01']
}
$('#country').change(function(){
    var dateopts = ''
    $.each(data[$(this).val()],function(i,v){
        dateopts += "<option value='"+v+"'>"+v+"</option>"
    })
    $('#dates').html(dateopts)
})

当国家发生变化时，将构建并填充第二个选择框的选项。

查看这里的工作示例:http://jsfiddle.net/xHxcD/

---

上面的方法要求所有数据与初始页面请求一起发送到客户端。如果有很多数据，最好通过AJAX接收数据。最简单的方法是在PHP中构建一个具有与客户端相同数据结构的对象，然后使用json_encode将其转换为JSON字符串并将其回显出来。

将其读入客户端就像这样简单:

$.ajax('myJsonData.php?country=india',function(jsonData){ data.india = jsonData })

两种方法都可以。如果不想使用ajax，只需将每个选项加载到对象中。然后，当你从select #1中选择一些东西时，用来自对象的相关数据数组填充#2。

如果我要这样做，我不会用ajax做，除非有海量的数据。

不使用php也可以做到。为此，您必须在Javascript数组中分配两个不同的状态列表，并根据选择更改另一个选择框中的选项。就这么简单。

如果你使用数据库来存储状态，你可以在加载页面时使用服务器端脚本语言分配javascript数组。

但是，除非数据量很小，否则不要这样做。在你的情况下，你只有两个国家，所以你可以继续。

让我们举一个简单的例子，我使用它的目的和你想要的一样，它工作得很好。

这是国家列表:

<?php
        $countrylist=mysql_query("SELECT * FROM country ORDER BY name ASC");
        echo "<select name='country' id='country' onchange='"reload(this.form)'" title='Country e:g; United Kingdom,Pakistan'><option value='0'>Select Country</option>";
        while($clist=mysql_fetch_array($countrylist))
        {
          echo "<option value='$clist[Name]'>$clist[Name]</option>"."<br/>";
        }
        echo "</select>";
 ?>

这是区域下拉列表:

<select name="region" id="region" ></select>

现在创建一个名为crlist.js的单独文件，并将其包含在上面代码的页面中，如下所示:

<script  type="text/javascript" src="crlist.js"> </script>

list.js代码:

var request = false;
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
request = false;
}
}
@end @*/
function fillSelect(country,path) {
var url = path+"crlist.php?country=" + country;
request.open("GET", url, true);
request.onreadystatechange = go;
request.send(null);
}
function go() {
if (request.readyState == 4) {
//if (request.status == 200) {
var response = request.responseText;
var list=document.getElementById("region");
            for (i = list.length - 1; i>=0; i--) {
                list.remove(i);
            }
var records=response.split('|');
for (i=1; i<records.length; i++) {
    //alert("rcord="+records[i]);
    var record=records[i].split('*');
    var region=record[0];
    //alert("region="+region);
    var regionid=record[1];
    //alert("regionid="+regionid);
    var x=document.createElement('option');
    //var y=document.createTextNode(region);
    x.text=region;
    //x.value=region;
    //alert(x.text);
   //x.appendChild(y);
   //list.appendChild(x);
   list.options.add(x);
   }
  //}
 }
}
function initCs(path) {
if (!request && typeof XMLHttpRequest != 'undefined') {
request = new XMLHttpRequest();
}
var country=document.getElementById('country');
    country.onchange=function() {
        if(this.value!="Select") {
            var list=document.getElementById("region");
            for (i = list.length - 1; i>=0; i--) {
                list.remove(i);
            }
        //while (list.childNodes[0]) {
        //list.removeChild(list.childNodes[0]);
        //}
        }
        fillSelect(this.value,path);
        //alert(this.value);
    }
//fillSelect(country.value);
}

现在创建一个名为crlist.php的单独文件。

list.php代码:

<?php
require_once 'yourconfigfile.php';
$cname = $_GET['country'];
$query="select ID,Name from city where CountryCode=(select code from country where name='$cname') Order By Name ASC";
$res = mysql_query($query) or die(mysql_error());
while($region = mysql_fetch_array($res)){
    echo "<option value='".$region['Name']."'>".$region['Name']."</option>";
}       
?>

现在在带有下拉菜单的页面上添加以下脚本:

<script  type="text/javascript" src="crlist.js"> </script>
<script>
$(document).ready(function() {
    initCs("");
});
</script>

这是我自己的脚本，我假设您已经创建了国家和地区表。但是你需要根据你的数据库结构调整查询和上面的代码。

参考我的回答:级联下拉列表使用jQuery/PHP