jquery+三级联动

definitely：三个下拉框，两个change事件

<div id="app">

province:
<select id="provinceid">
    <option> 空</option>
</select>
<hr>
city:
<select id="cityid">
    <option> 空</option>
</select>
<hr>
country:
<select id="countryid">
    <option> 空</option>
</select>
</div>

初始下 下拉框，非常简单

$(document).ready(function(){
    
    $.ajax({
        url:"getCity", 
        data:"",
        success:function(returnStr){
            ajaxReturnStr=returnStr;
            console.log(ajaxReturnStr);
            $.each(ajaxReturnStr,function(index,json){
                var optionDom="<option value="+json.id+">"+json.cityname+"</option>";
                $("#provinceid").append(optionDom);
                
            });//each
        },
        async : false,
        error : function(){
        }
    });//ajax
    
});

省联动，change事件

//js,jquery, es6
$("#provinceid").change(function(){
    
    var pid=$("#provinceid").val();//所选择省份的id
    
    $("#cityid").empty();
    $("#cityid").append("<option> 空</option>");
    
    
    $.ajax({
        url:"getCity?pid="+pid, 
        data:"",
        success:function(returnStr){
            ajaxReturnStr=returnStr;
            console.log(ajaxReturnStr);
            $.each(ajaxReturnStr,function(index,json){
                var optionDom="<option value="+json.id+">"+json.cityname+"</option>";
                $("#cityid").append(optionDom);
                
            });//each
        },
        async : false,
        error : function(){
        }
    });//ajax
    
});


$("#cityid").change(function(){
    
    var pid=$("#cityid").val();//所选择省份的id
    
    $("#countryid").empty();
    $("#countryid").append("<option> 空</option>");
    
    
    $.ajax({
        url:"getCity?pid="+pid, 
        data:"",
        success:function(returnStr){
            ajaxReturnStr=returnStr;
            console.log(ajaxReturnStr);
            $.each(ajaxReturnStr,function(index,json){
                var optionDom="<option value="+json.id+">"+json.cityname+"</option>";
                $("#countryid").append(optionDom);
                
            });//each
        },
        async : false,
        error : function(){
        }
    });//ajax
    
});

--增加的时候，三级联动，需要在数据库设计为三个字段还是一个字段