感触life

二级联动之PHP+Mysql+JQ

数据库截图

文件1: select.php;

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>二级联动</title>
	<script src="js/jquery.min.js?v=2.1.4"></script>
<script>
//下面是页面加载时自动执行一次getSelectVal()函数
	$().ready(function(){
	    getSelectVal();
	    $("#bid").change(function(){//大类有变动时,执行getSelectVal()函数
	        getSelectVal();
	    });
	});
	function getSelectVal(){
    $.getJSON("server.php",{bid:$("#bid").val()},function(json){
        var sid = $("#sid");
        $("option",sid).remove(); //清空原有的选项
        $.each(json,function(index,array){
            var option = "<option value='"+array['ID']+"'>"+array['MenuName']+"</option>";
            sid.append(option);//添加一项option,这里有循环
        });
    });
}
</script>
</head>
<body>


<label>大类:</label>
<select name="bid" id="bid" >

<?php
error_reporting(0);
include_once("../core/sys.func.php");//链接数据库
$sql="select * from z_dmenu where Sid=0";
$query=mysql_query($sql);

 while($row=mysql_fetch_array($query)){
    //var_dump($row);
    echo "<option value=\"".$row['ID']."\">".$row['MenuName']."</option>";

}
?>

</select>
<label>小类:</label>
<select name="sid" id="sid">
</select>

</body>
</html>

文件2: server.php;

<?php
error_reporting(0);
include_once("../core/sys.func.php");//链接数据库

    $ID= $_GET['bid'];
    if (isset($ID)) {
        $sql=mysql_query("select * from z_dmenu where Sid=$ID");
        while ($row=mysql_fetch_array($sql)) {
            $select[]=array("ID"=>$row['ID'],"MenuName"=>$row['MenuName']);

        }
        echo json_encode($select);
    }

注意事项:记得引入JQ库,链接数据库代码自行添加

码字很辛苦,转载请注明来自感触life-博客《二级联动之PHP+Mysql+JQ》

评论