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;
?>
