异步加载Flickr数据[jsonp]

<head>
<meta http-equiv='content-type' content='text/html;charset=utf-8'>
</head>
<pre>
jsonFlickrFeed({
"title": "sunset - Everyone's Tagged Photos"
"link": "http://www.flickr.com/photos/tags/sunset/"
"description": "A feed of sunset - Everyone's Tagged Photos"
"modified": "2007-01-29T16:45:24Z"
"generator": "http://www.flickr.com/"
"items": [ { "title": "IMG_0697"
"link": "http://www.flickr.com/photos/32655671@N00/373458148/"
"media": { "m":"http://farm1.static.flickr.com/123/373458148_70dbabf167_m.jpg" }
"date_taken": "2006-07-22T22:51:18-08:00"
"description": "Long description -- contians HTML"
"published": "2007-01-29T16:45:24Z"
"author": "nobody@flickr.com (mae2007)"
"tags": "africa sunset water"
}
]
</pre>
网址：http://www.hunlock.com/blogs/Howto_Dynamically_Insert_Javascript_And_CSS

<script type="text/javascript">
function jsonFlickrFeed(feed){
z='';
for (x=0; x<feed.items.length; x++) {
link = feed.items[x].link;
tmp=feed.items[x].media.m;
tmp=tmp.replace(/_m\.jpg/g,'_s.jpg');
z += '<a href="' + link + '" target="_blank">';
z+='<img src="'+tmp+'" alt="some img" width="75px" height="75px" style="margin: 2px; border:none">';
z += '</a>';
}
document.getElementById('pics').style.display='block';
document.getElementById('pics').innerHTML=z;
}
function searchFlickr() {
var headID = document.getElementsByTagName("head")[0];
var newScript = document.createElement('script');
tagID = escape(document.getElementById('tags').value);
document.getElementById('tags').value='';
newScript.type = 'text/javascript';
newScript.src = 'http://flickr.com/services/feeds/photos_public.gne?tags=' + tagID + '&format=json';
headID.appendChild(newScript);
document.getElementById('pics').style.display='block';
document.getElementById('pics').innerHTML="Loading...";
return false;
}
</script>
<form action = "#" onsubmit="return searchFlickr();">
<input type='text' size='40' id='tags'>   <input type='submit'>
</form>
<div style='border: 1px solid black; width: 100%; display: none;' id='pics'></div>

没有评论

异步加载Flickr数据[jsonp]

文章TOP15