关于json+jquery的问题 如何遍历json数组

vinner7 2015-06-23 05:28:19
HTML:
 <h2> 生活缴费
<select id="provinceMenu" class="pd410"><option ></option></select>
<select id="cityMenu" class="pd410"><option ></option></select></h2>
</div> <div class="con_jf"><h4>缴费单位:</h4><select class="pd410"><option>福州市自来水公司</option></select></div>
<div class="con_jf"><h4>户号:</h4><input class="pd410" name="account" id="account" maxlength="40" type="text"></div>
<div class="con_jf"><h4>缴费金额:</h4><input class="pd410" name="account" id="account" maxlength="40" placeholder="任意充" type="text"></div>
</div>


<div class="con disn" id="con2">
<div class="con_jf"><h4>缴费单位:</h4><select class="pd410"><option>福州市自来水公司</option></select></div>
<div class="con_jf"><h4>燃气费户号:</h4><input class="pd410" name="account" id="account" maxlength="40" type="text"></div>
<div class="con_jf"><h4>缴费金额:</h4><input class="pd410" name="account" id="account" maxlength="40" placeholder="任意充" type="text"></div>
</div>
<div class="con disn" id="con3">
<div class="con_jf"><h4>缴费单位:</h4><select class="pd410"><option>福州市自来水公司</option></select></div>
<div class="con_jf"><h4>户号:</h4><input class="pd410" name="account" id="account" maxlength="40" type="text"></div>
<div class="con_jf"><h4>缴费金额:</h4><input class="pd410" name="account" id="account" maxlength="40" placeholder="任意充" type="text"></div>

部分Json:
varitems_localLife={
"RECORDS": [
{
"cityList": [
{
"cityId": "v2132",
"cityName": "兰州",
"projectList": [
{
"projectId": "c2680",
"projectName": "电费",
"unitList": [
{
"modeList": [
{
"itemList": [
{
"itemId": "6496900",
"itemName": "甘肃兰州 兰州供电公司 电费户号 任意充直充"
}
],
"modeId": "v2620",
"modeName": "户号"
}
],
"unitId": "v75886",
"unitName": "兰州供电公司"
},
{
"modeList": [
{
"itemList": [
{
"itemId": "64190201",
"itemName": "甘肃兰州 甘肃省电力公司 电费 户号 直充任意充"
}
],
"modeId": "v2620",
"modeName": "户号"
}
],
"unitId": "v81322",
"unitName": "甘肃省电力公司"
}
]
}
]
},
"provinceId": "v1955",
"provinceName": "浙江"
},


完整Json :http://pic.ofcard.com/cloudshop/qmopen/elife/items_localLife.js
...全文
160 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
峰尚网络 2015-06-24
  • 打赏
  • 举报
回复

<script  type="text/javascript">
    $(document).ready(function() {
        var currentProvince;
        var currentCity;
        var provinceList = items_localLife.RECORDS;
        $("#provinceMenu").append('<option>请选择省份</option>');
        for (var i = 0; i < provinceList.length; i ++) {
            var province = provinceList[i];
            $("#provinceMenu").append('<option value="'+ province.provinceId +'">'+ province.provinceName + '(' + province.provinceId + ')' +'</option>');
        }
       
        $("#provinceMenu").on("change", function() {
            clearDetail();
            $("#cityMenu").empty();
            var provinceId = $("#provinceMenu :selected").val();
            if (provinceId == '') {
                return;
            }
            var cityList;
            for (var i = 0; i < provinceList.length; i ++ ) {
                if (provinceList[i].provinceId == provinceId) {
                    cityList = provinceList[i].cityList;
                    currentProvince = provinceList[i];
                    break;
                }
            }
            $("#cityMenu").append('<option>请选择城市</option>');
            for (var j = 0; j < cityList.length; j ++) {
                var city = cityList[j];
                $("#cityMenu").append('<option value="'+ city.cityId +'">'+ city.cityName + '(' + city.cityId + ')' +'</option>');
            }
            $("#cityMenu").trigger("chosen:updated");
        });
        $("#cityMenu").on("change", function() {
            clearDetail();
            var cityId = $("#cityMenu :selected").val();
            if (cityId == '') {
                return;
            }
            for (var i = 0; i < currentProvince.cityList.length; i ++) {
                if (cityId == currentProvince.cityList[i].cityId) {
                    currentCity = currentProvince.cityList[i];
                    break;
                }
            }
            for (var j = 0; j < currentCity.projectList.length; j ++) {
                var project = currentCity.projectList[j];
                //水费
                switch (project.projectId) {
                    case "c2670":
                        $("#water").html(createUnitTable(project.unitList));
                        break;
                    case "c2680":
                        $("#elec").html(createUnitTable(project.unitList));
                        break;
                    case "c2681":
                        $("#gas").html(createUnitTable(project.unitList));
                        break;
                    default:
                        break;
                }
            }
            setheight();
        });
        setheight();
    });
    function createUnitTable(unitList) {
        if (unitList.length > 0) {
            var table = '<table class="table table-bordered"><thead><tr><th>缴费单位</th><th>缴费方式</th><th>缴费商品</th></tr></thead><tbody>';
            for (var i = 0; i < unitList.length; i ++) {
                var unit = unitList[i];
                var modeList = unitList[i].modeList;
                for (var j = 0; j < modeList.length; j ++) {
                    var mode = modeList[j];
                    table += '<tr>'
                    table += '<td>'+ unit.unitName + '(' + unit.unitId +')' +'</td>';
                    table += '<td>'+ mode.modeName + '(' + mode.modeId +')' +'</td>';
                    table += '<td>'+ JSON.stringify(mode.itemList) +'</td>';
                    table += '</tr>'
                }
            }
            table += '</tbody></table>';
            return table;
        } else {
            return "暂无商品";
        }
    }
    function clearDetail(){
        $("#water").html('');
        $("#elec").html('');
        $("#gas").html('');
    }
    function setheight(){
        window.parent.callback_setContentHeight && window.parent.callback_setContentHeight();
    }
</script>
vinner7 2015-06-24
  • 打赏
  • 举报
回复
引用 1 楼 slwsss 的回复:
for for(var i=0;i<items_localLife.RECORDS.length;i++){alert(items_localLife.RECORDS[i].provinceName);for(var j=0;j<items_localLife.RECORDS[i].cityList.length;j++)alert(items_localLife.RECORDS[i].cityList[j].cityName)}
不是这样写的 达不到效果
slwsss 2015-06-23
  • 打赏
  • 举报
回复
for for(var i=0;i<items_localLife.RECORDS.length;i++){alert(items_localLife.RECORDS[i].provinceName);for(var j=0;j<items_localLife.RECORDS[i].cityList.length;j++)alert(items_localLife.RECORDS[i].cityList[j].cityName)}

87,888

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧