感谢这个站点,我现在有从服务器返回的 json 数据,很好地填充了我的页面。
返回的字段之一是NUM_PHOTOS
. 每张照片至少有 1 张item.id
。
但是实际的照片不在 json 数据中,它们在一个 diff 目录中,并且全部递增并开始'item.id'+/1.jpg
于并取决于NUM_PHOTOS
该特定项目的存在。
例如,对于项目“20090”,有 5 张照片,在一个单独的目录中: /20090/1.jpg, 20090/2.jpg, etc.
最多有多少张照片。我如何.jpg
根据每个 NUM_PHOTOS增加前缀的数字item.id?
我已经使用下面的代码为每个“item.id”动态填充了 flexsider 的前 3 张图像,但是当然照片的数量会有所不同,我被困在需要附加的.jpg'
s前缀上对于NUM_PHOTOS
每个item.id.
$('.flexslider .slides').append('<li><img src="http://url/data/listing/pics/' + item.id + '/1.jpg"></li>');
$('.slides').append('<li><img src="http://www.url.co.nz/data/listing/pics/' + item.id + '/2.jpg"></li>');
$('.slides').append('<li><img src="http://www.url.co.nz/data/listing/pics/' + item.id + '/3.jpg"></li>');
}
我尝试了几种技术,但作为一个初学者,我需要一点帮助。
JS is:
$('#detailsPage').live('pagebeforeshow', function(event) {
var id = getUrlVars()["id"];
$.getJSON('http://www.url.co.nz/feeds/json_detail.php?id='+id, displayItem);
});
function displayItem(data) {
var listing = data.item;
$('#id').text(listing.id + ', ' + listing.suburb + ', ' +listing.district);
$('#Title').text(listing.title);
$('#numberPhotos').text(listing.num_photos);
$('#price').text('Price Approx: ' + '$' + listing.price );
// how do i auto increment the .jpg according the 'num_photos' field returned from json?
// ????? if (listing.num_photos???????) {
$('.flexslider .slides').append('<li><img src="http://www.url.co.nz/data/listing/pics/' + listing.id + '/1.jpg"></li>');
$('.slides').append('<li><img src="http://www.url.co.nz/data/listing/pics/' + listing.id + '/2.jpg"></li>');
$('.slides').append('<li><img src="http://www.url.co.nz/data/listing/pics/' + listing.id + '/3.jpg"></li>');
}
function getUrlVars() {
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++)
{
hash = hashes[i].split('=');
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
}