
这样的列表,怎么动态生成?
我想通过造假数据生成,下面的是我的假数据,3个列表:
var data = {
"doctorList":[{
"doctorId":"d001",
"doctorImg":"http://img.dongqiudi.com/uploads/avatar/2014/10/20/8MCTb0WBFG_thumb_1413805282863.jpg",
"doctorName":"潘仁和",
"doctorDevlement":"骨科",
"hospitalName":"上海华山医院"
},{
"doctorId":"d002",
"doctorImg":"http://cdn.duitang.com/uploads/item/201410/05/20141005160337_RZX8W.thumb.224_0.jpeg",
"doctorName":"李丽",
"doctorDevlement":"儿科",
"hospitalName":"上海中山医院"
},{
"doctorId":"d003",
"doctorImg":"http://diy.qqjay.com/u2/2012/0924/7032b10ffcdfc9b096ac46bde0d2925b.jpg",
"doctorName":"陆子林",
"doctorDevlement":"儿科",
"hospitalName":"上海中山医院"
}]
}
其中每个列表的样式为:
每个weui-jiaj-panel都要放在id="tab1"中,我通过下面的方法,把一个列表拼出来了,但是要把假数据拼成3个列表,就不会了,请问该怎么操作?下面是我的:
$(function () {
//创建最外层p
var $main = $('');
$main.addClass('weui-jiaj-panel');
var $str = $('');
$str.attr('href','department/change_doctor_info.html');
$str.attr('target','_blank');
$str.addClass('weui-jiaj-a-color');
//创建列表
var $mediaBox = $('');
var $doctorImgBox = $('');
var $doctorImg = $('
').attr('src','url');
$doctorImg.addClass('weui-media-box__thumb');
//创建医生信息p
var $doctorBox = $('');
var $doctorName = $('');
var $doctorDevelment = $('');
var $doctorHospital = $('');
//创建右箭头
var $jiantou = $('');
//医生信息添加到医生信息p中
$doctorBox.append($doctorName);
$doctorBox.append($doctorDevelment);
$doctorBox.append($doctorHospital);
$doctorImgBox.append($doctorImg);
//最外层p
$mediaBox.append($doctorImgBox);
$mediaBox.append($doctorBox);
$mediaBox.append($jiantou);
$str.append($mediaBox);
//将a标签添加到p
$main.append($str);
//将p添加到#tab1
$('#tab1').append($main);
});
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
实现上你的代码已经把创建和加入 tab1 的逻辑写完了,只需要把
$('#tab1').append($main)之前的代码按数据项重复,并在生成 $xxxxx 的时候适当的插入数据值(可以用$xxxx.text(docutor.docutorName)这样)。把你写的这段代码写成一个函数,比如
createJiajPanel(dockerData),返回得到的$main。对于数据,
dockerList是个列表,可以这样楼主主要问的是“把假数据拼成3个列表” 先抛开操作dom的性能问题不说 你已经把创建跟插入做粗来了 就剩下获取假数据了 你在js文件中直接循环data获取值 然后在插入每个p的时候拼接上去就可以了