zoukankan      html  css  js  c++  java
  • 省市县三级异步加载导航

    省市县三级联动(动态):
    逻辑:请求后台数据 一级菜单(省),创建html,赋值,添加,每个菜单绑定点击事件,根据与2级菜单的关系数据请求数据,加载2级菜单(市),同理获取三级菜单(县、区)
    //点击加载省
    function province() {
    var proHtml = '', that = this;
    getData(gg.core.url.rootPath+"/ta/admin/areanum/list/", 0, function (data) {
    for (var i = 0; i < data.length; i++) {
    proHtml += '<option value="' + data[i].zipCode +'.'+data[i].name+'">' + data[i].name + '</option>';
    }
    //初始化省数据
    $("select[name=province]").append(proHtml);
    form.render();
    form.on('select(province)', function (proData) {
    $("select[name=area]").html('<option value="">请选择县/区</option>');
    //获取联动参数:zipCode以及省份值
    var zipCode = parseInt(proData.value.split('.')[0]);
    if (zipCode > 0) {
    getData(gg.core.url.rootPath+"/ta/admin/areanum/list/", zipCode, city);

    } else {
    $("select[name=city]").attr("disabled", "disabled");
    }
    });
    })
    }
    //市加载
    function city(city) {
    var cityHtml = '<option value="">请选择市</option>', that = this;
    for (var i = 0; i < city.length; i++) {
    cityHtml += '<option value="' + city[i].zipCode + '.'+city[i].name+'">' + city[i].name + '</option>';
    }
    $("select[name=city]").html(cityHtml).removeAttr("disabled");
    form.render();
    form.on('select(city)', function (cityData) {
    var zipCode = parseInt(cityData.value.split('.')[0]);
    if (zipCode > 0) {
    getData(gg.core.url.rootPath+"/ta/admin/areanum/list/", zipCode, area);
    } else {
    $("select[name=area]").attr("disabled", "disabled");
    }
    });
    }
    //县/区加载
    function area(area) {
    var areaHtml = '<option value="">请选择县/区</option>', that = this;
    for (var i = 0; i < area.length; i++) {
    areaHtml += '<option value="' + area[i].zipCode + '.'+area[i].name+'">' + area[i].name + '</option>';
    }
    $("select[name=area]").html(areaHtml).removeAttr("disabled");
    form.render();
    form.on('select(area)', function (ar) {
    //console.log(ar);
    var zipCode = parseInt(ar.value.split('.')[0]);
    console.log(zipCode);
    if (zipCode > 0) {
    placeId(zipCode)
    } else {
    $("select[name=placeId]").attr("disabled", "disabled");
    }
    });
    }

     后台数据格式:"data": { "id": 1, "name": "北京市", "preCode": "0", "zipCode": "11" },

  • 相关阅读:
    JVM系列四:生产环境参数实例及分析【生产环境实例增加中】
    JVM系列三:JVM参数设置、分析
    JVM系列二:GC策略&内存申请、对象衰老
    JVM系列一:JVM内存组成及分配
    windows下揪出java程序占用cpu很高的线程 并找到问题代码 死循环线程代码
    微信小程序使用字体图标
    Jetson tx2 串口通信
    categorical[np.arange(n), y] = 1 IndexError: index 2 is out of bounds for axis 1 with size 2
    cannot import name '_imaging' 报错
    VS2015 opencv 无法打开文件“opencv_calib3d330d.lib”
  • 原文地址:https://www.cnblogs.com/tutao1995/p/9777217.html
Copyright © 2011-2022 走看看