• 二级联动


    HTML:<span id="lab_game"></span>

    JS:
    $(document).ready(function () {
    var xselect = ''
    var nselect = ''
    $.ajax({
    type: "post",
    url: "__ROOT__/area/getAppInfo",
    data:'',
    dataType: "json",
    success: function (res) {
    console.log(res)
    for(i=0;i<res.data.length;i++){
    xselect += '<option value="'+res.data[i].area_id+'">'+res.data[i].area_name+'</option>'
    }
    for(u=0;u<res.data[0].app_info.length;u++){
    nselect += '<option value="'+res.data[0].app_info[u].app_id+'">'+res.data[0].app_info[u].name+'</option>'
    }
    $("#lab_game").append('<label class="col-sm-2 control-dy">地区:</label>'+
    '<div class="col-sm-8 form-time1">'+
    '<select class="form-control form-select" id="area_id">'+xselect+
    '</select>'+
    '</div>'+
    '<label class="col-sm-2 control-dy">游戏:</label>'+
    '<div class="col-sm-8 form-time1">'+
    '<select class="form-control form-select" id="app_id">'+
    '<option value="">请选择状态</option>'+ nselect +
    '</select>'+
    '</div>')

    $("#area_id").change(function(){
    console.log($(this).val())
    var this_value = $(this).val();
    for(var i=0;i<res.data.length;i++){
    var now_data = res.data[i];
    if(now_data.area_id==this_value){
    var str = "";
    for(var j=0;j<now_data["app_info"].length;j++){
    var now_data_ = now_data["app_info"][j];
    str += '<option value="'+now_data_.app_id+'">'+now_data_.name+'</option>'
    }
    $("#app_id option:gt(0)").remove();
    $("#app_id").append(str);
    }
    }
    })
    }
    });
    })

    数据结构:

    {
        "code": 0,
        "mess": "成功",
        "data": [
            {
                "area_id": 1,
                "area_name": "天津",
                "app_info": [
                    {
                        "app_id": 26891,
                        "name": "盼盼1.0"
                    },
                    {
                        "app_id": 71988,
                        "name": "盼盼2.0"
                    }
                ]
            },
            {
                "area_id": 2,
                "area_name": "四川省",
                "app_info": [
                    {
                        "app_id": 26893,
                        "name": "旺旺1.0"
                    },
                    {
                        "app_id": 26894,
                        "name": "旺旺2.0"
                    }
                ]
            }
        ]
    }
  • 相关阅读:
    Python基础学习
    My First Bog
    WPF 自定义窗口,自定义控件和样式
    WPF 数据规则验证
    C# 类的扩展方法
    C# 类的序列化和反序列化
    数据库使用空间查询方法
    关于linux环境下django获取中文url报错处理
    Django中关于csrf_token的认证
    Django + Uwsgi + Nginx 的生产环境部署
  • 原文地址:https://www.cnblogs.com/PoisonousMushrooms/p/12530834.html
Copyright © 2020-2023  润新知