您的位置:首页 > Web前端 > JQuery

jquery+ajax渲染,简单的拼接字符串

2017-10-30 12:29 411 查看
.html

<div class="addressul">
<ul>

</ul>
</div>


.json

{
"status": "Y",
"data": [{
"id": "0001",
"name": "张三",
"province": "山东",
"city":"烟台",
"area":"芝罘区",
"address": "新城街道",
"mobile":"18660057131",
},{
"id": "0002",
"name": "李四",
"province": "山东",
"city":"烟台",
"area":"福山区",
"address": "新城街道",
"mobile":"16607891700",

},{
"id": "0002",
"name": "露露",
"province": "海南市",
"city":"三亚经济开发区",
"area":"东东西",
"address": "的街道",
"mobile":"13607891700",

}]
}


.js

$.ajax({
url: seajs.api.address,
type: 'GET',
dataType: 'json',
success: function(res) {
if(res.status==="Y"){
if(res.data.length > 0){
for (var i = 0; i <res.data.length ; i++) {
var data=res.data[i];
$('.addressul ul').append(
'<li class="address_cont" id="address_cont">'+
'<a class="add_xx" href="">'+
'<div class="xx_left">'+
'<div class="xl_top">'+
'<span class="_name"><i class="ion"></i>'+data.name+'</span>'+
'<span class="_iphone"><i class="ion"></i>'+data.mobile+'</span>'+
'</div>'+
'<div class="xlauto">'+data.province+data.area+data.address +'</div>'+
'</div>'+
'</a>'+
'</li>'
);
}
}
}else{
console.log('链接失败');
}
}
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: