我正在尝试自定义一个插件,该插件使用以下功能呈现 Tumblr 帖子的图像。
到目前为止,如果有 2 个或更多图像,我只设法将 .photoset 类添加到照片帖子的 ul 中。
function getImages(post) {
// console.log(post)
var html = [];
html.push("<ul class='tumblr_post_images'>")
$.each(post.photos, function (i, photo) {
html.push('<li class="photo"><img src=' + photo.alt_sizes[0].url + '></li>')
})
$('.post_photo ul').has('li:nth-child(n+2)').addClass("photoset");
html.push("</ul>")
return html.join("");
};
理想情况下,我希望它仅在帖子中有超过 2 张图像时才呈现 ul,以便标记干净。我尝试了一些条件语句,但我无法让它工作。任何帮助都感激不尽。
更新 感谢 TJ Crowders 的回答,我设法找到了解决问题的方法。这是有效的代码:
//Function to retrieve all the images from the post. This builds an array which is then returned as html list of images.
function getImages(post) {
var html = [];
// Get the HTML
if (post.photos.length === 1) {
$.each(post.photos, function (i, photo) {
html.push('<img src=' + photo.alt_sizes[0].url + '>')
})}
else {
// More than one
html.push("<ul class='photoset'>")
$.each(post.photos, function (i, photo) {
html.push('<li class="photo"><img src=' + photo.alt_sizes[0].url + '></li>')
});
html.push("</ul>");
}
return html.join("");
}
更新 2 TJ Crowders 的原始答案中有一个错误。他修复了它,现在他的答案有效!谢谢!