<!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=iso-8859-1" />
<title>Sections Demo</title>
<script type = "text/javascript" src = "http://ajax.googleapis.com/
ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".state").change(function()
{
var id = $(this).val();
var dataString = 'id=' + id;
$.ajax
({
type: "POST",
url: "ajax_city.php",
data: dataString,
cache: false,
success: function(html)
{
$(".district").html(html);
}
});
});
});
</script>
<style>
label
{
font-weight:bold;
padding:10px;
}
</style>
</head>
<body>
<div style="margin:80px">
<label>state :</label> <select name="country" class="country">
<option selected="selected">--Select state--</option>
<?php
include('db.php');
$sql = mysql_query("select id,data from states where weight='1'");
while ($row = mysql_fetch_array($sql)) {
$id = $row['id'];
$data = $row['data'];
echo '<option value="' . $id . '">' . $data . '</option>';
}
?>
</select> <br/><br/>
<label>district :</label> <select name="district" class="district">
<option selected="selected">--Select district--</option>
</select>
</div>
</body>
</html>
我试图创建一个多个下拉列表，其中每个下拉列表都依赖于前一个下拉列表…例如:我想创建一个州的下拉列表，当选择一个州时，该州的地区将在下一个下拉列表中列出，所选数据将存储在数据库中…有人能帮我解决一下吗?提前感谢……: -)
它不会返回false，因为ajax方法是异步的，它不会等待成功事件发生。可以使用
命令使ajax同步async: false
，但这不是一个好方法。它也会冻结浏览器