实用的mysql+ajax+php 三级级联下拉框
1,昨天弄了一个简单的三级级联下拉框。超级实用。
index.php:
[code]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Ajax联动菜单</title>
<script language="javascript" type="text/javascript" src="aa.js"></script>
</head>
<body>
<form>
<label>
<select name="sel" id="sel" onChange="showMenu(this.value);">
<option>一级分类</option>
<?php
$conn = mysql_connect('localhost', 'root', '') or die('Could not connect: ' . mysql_error());
mysql_select_db('fitment', $conn) or die ('Can\'t use database : ' . mysql_error());
mysql_query("set names 'gb2312'");
$str = "SELECT * FROM `fitment_sort` where supid = '0' ORDER BY `id` ASC";
$result = mysql_query($str) or die("Invalid query: " . mysql_error());
if($result)
{
while ($arr = mysql_fetch_array($result)){
echo <<<EOD
<option value={$arr["id"]}>{$arr["name"]}</option>
EOD;
}
}
mysql_close($conn);
?>
</select>
</label>
<label>
<select name="sel2" id="sel2" onChange="showMenu2(this.value)">
<option>二级分类</option>
</select>
</label>
<label>
<select name="sel3" id="sel3">
<option>三级分类</option>
</select>
</label>
</form>
<input type=button value="send value" onClick="alert(document.getElementByIdx('sel').options[document.getElementByIdx('sel').selectedIndex].text + '-' + document.getElementByIdx('sel2').options[document.getElementByIdx('sel2').selectedIndex].text + '-' + document.getElementByIdx('sel3').options[document.getElementByIdx('sel3').selectedIndex].text)">
</body>
</html>[/code]