动态获取vimeovideo的缩略图和标题

从这个问题中挑选出来: 从Vimeo获取img缩略图?

我正在尝试创建一个包含几个vimeovideo的页面。

我希望HTML中的video看起来像这样:

然后我希望jQuery用img填充divs ,其中src是来自vimeo的缩略图, a是指向video的a,其文本是video的标题。 也就是说,它应该像这样结束:

  

(为清楚起见,添加了缩进)

这是我从其他问题的出发点:

  $.ajax({ type:'GET', url: 'http://vimeo.com/api/v2/video/' + video_id + '.json', jsonp: 'callback', dataType: 'jsonp', success: function(data){ var thumbnail_src = data[0].thumbnail_large; $('#thumb_wrapper').append(''); } });  

试试这个:-

假设id已经存在div。

  success: function(data){ $('',{ href:data[0].url, text:data[0].title }).append( $('' ,{ src:data[0].thumbnail_large }) ) .appendTo('#'+data[0].id) } 

如果id不存在div: –

  success: function(data){ $('',{ href:data[0].url, text:data[0].title }) .append( $('' ,{ src:data[0].thumbnail_large }) ).appendTo($('
',{ id:data[0].id, class:'vimeo' })) .appendTo('.someContainer'); }

小提琴

将html附加到相应的div

 var vimeo_content="\ \ \ "; // on success function function(){ var vdata = data[0]; var thumbnail_src = vdata.thumbnail_large; var video_title = vdata.title; var video_url = vdata.url; $vimeo_content = $(vimeo_content); $vimeo_content.find('a').attr('href',url); $vimeo_content.find('img').attr('src',thumbnail_src); $vimeo_content.find('span').text(title); //append to corresponding div $vimeo_content.appendTo($('div#'+video_id)); }