index.php
<?php
$pdo=new pdo('mysql:host=localhost;dbname=news','root','');
$pdo->query('set names utf8');
$sql='select * from newstype';
$stmt=$pdo->query($sql);
$rs=$stmt->fetchAll(PDO::FETCH_ASSOC);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="jquery-1.11.3.min.js"></script>
<script>
$(function(){
$('#nav1').change(function(){
k=$(this).val();
$.get('ajax.php',{'typeid':k},function(data){
ds=JSON.parse(data);
txt="";
$.each(ds,function(i){
txt=txt+"<option val='"+ds[i].detailid+"'>"+ds[i].detailname+"</option>"
})
$("#nav2").html(txt);
})
})
})
</script>
</head>
<body>
<select name="" id="nav1">
<?php
foreach($rs as $v){
?>
<option <?php if($v['typeid']==3){ ?>selected='selected'<?php }?> value="<?php echo $v['typeid'] ?>"><?php echo $v['typename'] ?></option>
<?php
}
?>
</select>
<select name="" id="nav2">
<?php
$sql='select * from detailtype where typeid=3';
$stmt=$pdo->query($sql);
$rk=$stmt->fetchAll(PDO::FETCH_ASSOC);
foreach($rk as $v){
?>
<option value="<?php echo $v['detailid']?>"><?php echo $v['detailname']?></option>
<?php
}
?>
</select>
</body>
</html>
ajax.php
<?php
$pdo=new pdo('mysql:host=localhost;dbname=news','root','');
$pdo->query('set names utf8');
$typeid=$_GET['typeid'];
$sql="select * from detailtype where typeid={$typeid}";
$stmt=$pdo->query($sql);
$rs=$stmt->fetchAll(PDO::FETCH_ASSOC);
$ds=json_encode($rs);
echo $ds;
?>
