<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://code.ciaoca.com/jquery/cxSelect/demo/js/jquery.cxselect.min.js"></script>
</head>
<body>
<dd id="city_china_val">
<select class="province select" data-first-title="选择省">
<option value="">请选择</option>
</select>
<select class="city select" data-first-title="选择市">
<option value="">请选择</option>
</select>
<select class="area select" data-first-title="选择地区">
<option value="">请选择</option>
</select>
</dd>
<script type="text/javascript">
var jsonData = [
{'id':'11','name':'北京市','pid':'1'},
{'id':'22','name':'县','pid':'11'},
{'id':'33','name':'区','pid':'11'},
{'id':'44','name':'朝阳区','pid':'33'},
{'id':'55','name':'密云县','pid':'22'}
];
var data = [];
var n='n';
var c='c';
var s='s';
$(jsonData).each(function(i,e){console.log(jsonData[i])
if(jsonData[i].pid=='1'){
data.push({});
data[i][n]=jsonData[i].name;
data[i][c]=jsonData[i].id;
var sarry=[];
var ii=0;
$(jsonData).each(function(k,g){
if(jsonData[k].pid==jsonData[i].id){
sarry.push({});
sarry[ii][n]=jsonData[k].name;
sarry[ii][c]=jsonData[k].id;
var karry=[];
var kk=0;
$(jsonData).each(function(h,z){
if(jsonData[h].pid==jsonData[k].id){
karry.push({});
karry[kk][n]=jsonData[h].name;
karry[kk][c]=jsonData[h].id;
kk++;
}
})
sarry[ii][s]=karry;
ii++;
}
})
data[i][s]=sarry;
}
})
console.log(data)
$.cxSelect.defaults.data = data;
$('#city_china_val').cxSelect({
selects: ['province', 'city', 'area'],
nodata: 'none'
});
</script>
</body>
</html>
