下面是我的代码示例,在那里我使用 for loop 从ghost API获取数据并且工作正常。我想根据帖子iframe的视频代码在dyanamic youtube图片上附加数据。
single_carousel: function(){
var post_type_two = "carousel";
var section_heading_one = "Trending Videos";
var single_carousel_container = $(".video-carousel");
var single_carousel_items = "all";
$(".section-heading-one h3").append(section_heading_one);
$.get(ghost.url.api("posts",{
filter: "tag:"+post_type_two+"",
limit : single_carousel_items
})).done(function(data){
var postsInfo = data.posts;
if(postsInfo.length >0){
for(var i=0;i < postsInfo.length; i++){
post_title = postsInfo[i].title;
post_url = postsInfo[i].url;
post_image = postsInfo[i].image;
post_content = postsInfo[i].html;
$(".other").append("<div class='hidden'>"+post_content+"</div>");
if(post_image.length >0) {
single_carousel_container.append('<div class="single-video"><div class="video-img"><a href="'+post_url+'"><img src="'+post_image+'" alt="'+post_url+'" /></a><span class="video-duration">5.28</span></div><div class="video-content"><h4><a href="'+post_url+'" class="video-title">'+post_title+'</a></h4><div class="video-counter"><div class="video-viewers"> <span class="fa fa-eye view-icon"></span> <span>241,021</span></div><div class="video-feedback"><div class="video-like-counter"> <span class="fa fa-thumbs-o-up like-icon"></span> <span>2140</span></div><div class="video-like-counter"> <span class="fa fa-thumbs-o-down dislike-icon"></span> <span>2140</span></div></div></div></div></div>');
}
$(".other .hidden").each(function(){
var iframe_src = $(this).find("iframe").attr("src");
if(typeof iframe_src !== "undefined"){
var video_id = iframe_src.slice(-11);
var another_image = 'http://i3.ytimg.com/vi/'+video_id+'/maxresdefault.jpg';
if(another_image !== null && another_image !== "undefined" && another_image !== "" ) {
console.log(another_image);
}
}
});
}
}
});
},
但我希望使用 .other .hidden 课程找到iframe,并成功获得YouTube视频ID。
作为示例,我使用了以下函数,
$(".other .hidden").each(function(){
var iframe_src = $(this).find("iframe").attr("src");
if(typeof iframe_src !== "undefined"){
var video_id = iframe_src.slice(-11);
var another_image = 'http://i3.ytimg.com/vi/'+video_id+'/maxresdefault.jpg';
if(another_image !== null && another_image !== "undefined" && another_image !== "" ) {
console.log(another_image);
}
}
});
这也正常,现在我想为每个帖子项目显示特定的图像。现在实际显示多个图像的地方。