返回自己做的三级联......登陆

自己做的三级联动

朱太重2019-05-12 16:00:23289

<!doctype html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport"
         content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <script type="text/javascript" src="/plugins/jquery-3.3.1.min.js"></script>
   <title>三级联动</title>
</head>
<body>
省<select name="provice" id="provice">
</select>

<script type="text/javascript">
       $.getJSON('1.json',function(data){
           var options="<option value=‘’>请选择</option>";
           $.each(data,function(i){
               options+='<option value='+data[i].proId+'>'+data[i].proName+'</option>';
           });
           $('#provice').html(options);

       });

       $('#provice').change(function(){

           $.getJSON('2.json',function(data){
               var options="<option value=‘’>请选择</option>";
               var test=$('#provice').val();
               $.each(data,function(i){
                  if(test==data[i].proId)
                  {
                      options+='<option value='+data[i].cityId+'>'+data[i].cityName+'</option>';
                  }
               })
               $('#provice').after('市<select name="city" id="city"></select>').next().html(options);


           });

       })
</script>
</body>
</html>

最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送