zoukankan      html  css  js  c++  java
  • ajax省市县三级联动

    <div class="col-2 offset-2"><label><span>地址:<strong>&#42</strong></span></label></div>
    <div class="col-6" style="display: flex;justify-content: start;">
    <div id="select0"></div>
    <div id="select1"></div>
    <div id="select2"></div>
    <div id="select3"></div>
    </div>

    js

    // 省市县三级联动
    $(function(){
    var ss = "";
    $.get("https://www..com/lxzaixian/provinces/list",function(data){

    var json = eval(data);
    ss = ss + "<select onchange='getAllCity(this)' >";
    ss = ss + "<option>== 请选择省(区、市) ==</option>";
    for ( var i = 0; i < json.data.length; i++) {
    ss = ss + "<option value="+json.data[i].code+">" + json.data[i].name;
    ss = ss + "</option>";
    }
    ss = ss + "</select>";
    $("div#select0").html(ss);

    });
    })

    function getAllCity(obj) {
    console.log(obj.value)
    var ss = "";
    $.get("https://www..com/lxzaixian/cities/listByParentCode/"+obj.value, function(data) {
    var json = eval(data);
    console.log(json.data)
    ss +="<select onchange='getPalce(this)' >";
    ss +="<option>== 请选择城市 ==</option>";
    for ( var i = 0; i < json.data.length; i++) {
    ss += "<option value="+json.data[i].code+">" + json.data[i].name;
    ss += "</option>";
    }
    ss = ss + "</select>";
    $("div#select1").html(ss);

    });
    }

    function getPalce(obj){
    var ss="";
    $.get("https://www..com/lxzaixian/areas/listByParentCode/"+obj.value,function(data){
    var json = eval(data);
    ss +="<select onchange='getPalce1(this)' >";
    ss +="<option>== 请选择县区 ==</option>";
    for ( var i = 0; i < json.data.length; i++) {
    ss += "<option value="+json.data[i].code+">" + json.data[i].name;
    ss += "</option>";
    }
    ss = ss + "</select>";
    $("div#select2").html(ss);
    });

    }

    function getPalce1(obj){
    var ss="";
    $.get("https://www..com/lxzaixian/streets/listByParentCode/"+obj.value,function(data){
    var json = eval(data);
    ss +="<select>";
    ss +="<option>== 请选择街道区 ==</option>";
    for ( var i = 0; i < json.data.length; i++) {
    ss += "<option value="+json.data[i].code+">" + json.data[i].name;
    ss += "</option>";
    }
    ss = ss + "</select>";
    $("div#select3").html(ss);
    });

    }

  • 相关阅读:
    51nod1459 迷宫游戏
    51nod2006 飞行员配对(二分图最大匹配)
    51nod2006 飞行员配对(二分图最大匹配)
    GIT学习之路第四天 远程仓库
    GIT学习之路第四天 远程仓库
    搞懂树状数组
    搞懂树状数组
    线段树基础详解
    线段树基础详解
    折半枚举(双向搜索)poj27854 Values whose Sum is 0
  • 原文地址:https://www.cnblogs.com/-flq/p/10307722.html
Copyright © 2011-2022 走看看