动态获取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)); }