- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我想先说一下,我是 JS 的初学者,现在才使用它几天。
<小时/>这是我正在处理的内容http://jsfiddle.net/joyroyxw/
我想要做的是获取一个人的名字并显示他们名字中每个字母的图像。到目前为止,我可以将名称拆分为各个字母,并将“字母”连接为搜索标签,以便 flickr 返回每个字母的图像。
我的问题是这些图像没有按顺序添加,这可能是因为一个查询加载速度比另一个查询加载速度快吗?如何添加缓冲区或延迟以便每个字母按顺序显示?如果我的 for 循环按顺序将标签发送到函数,为什么会这样做?
<小时/>来自 jsfiddle 的 JavaScript:
function getQueryStringVar(name){
var qs = window.location.search.slice(1);
var props = qs.split("&");
for (var i=0 ; i < props.length;i++){
var pair = props[i].split("=");
if(pair[0] === name) {
return decodeURIComponent(pair[1]);
}
}
}
function getLetterImage(tag){
var flickerAPI = "https://www.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
$.getJSON( flickerAPI, {
tags: tag,
tagmode: "all",
format: "json"
})
.done(function (flickrdata) {
//console.log(flickrdata);
var i = Math.floor(Math.random() * flickrdata.items.length);
var item = flickrdata.items[i];
var url = item.media.m;
console.log(url);
$("body").append("<img src="+ url + "></img>");
});
}
$(document).ready(function() {
var name = getQueryStringVar("name") || "Derek";
var str = "letter,";
var searchtags = new Array()
for (var i = 0; i < name.length; i++) {
//console.log(str.concat(searchtags.charAt(i)));
searchtags[i] = str.concat(name.charAt(i));
}
for (var j = 0; j < name.length; j++){
//getLetterImage(searchtags[j]);
getLetterImage(searchtags[j]);
}
});
最佳答案
不要使用追加,而是尝试构建一个占位符元素来接收数据。
<div id="img1">Loading</div>
<div id="img2">Loading</div>
<div id="img3">Loading</div>
您可以根据需要使用 JavaScript 动态创建元素。然后按顺序填充它们。只需在进行时增加 i 即可。
$("#img"+i).html("<img src="+ url + "></img>");
更新
你的jsfiddle非常接近,但你必须记住ajax是异步的。
html
<body>
<h1>Hi! What's your name?</h1>
<form action="trending.html">
<input class="textbox" type="text" name="name">
</form>
<div id="img0">Loading</div>
<div id="img1">Loading</div>
<div id="img2">Loading</div>
<div id="img3">Loading</div>
<div id="img4">Loading</div>
</body>
JavaScript
function getQueryStringVar(name){
var qs = window.location.search.slice(1);
var props = qs.split("&");
for (var i=0 ; i < props.length;i++){
var pair = props[i].split("=");
if(pair[0] === name) {
return decodeURIComponent(pair[1]);
}
}
}
function getLetterImage(tag, theNumber){
var flickerAPI = "https://www.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
return $.getJSON( flickerAPI, {
tags: tag,
tagmode: "all",
format: "json"
})
.then(function (flickrdata) {
//console.log(flickrdata);
var i = Math.floor(Math.random() * flickrdata.items.length);
var item = flickrdata.items[i];
var url = item.media.m;
$("#img"+theNumber).html("<img src="+ url + "></img>");
});
}
$(document).ready(function() {
var name = getQueryStringVar("name") || "Derek Martin";
var str = "letter,";
var searchtags = new Array()
for (var i = 0; i < name.length; i++) {
searchtags[i] = str.concat(name.charAt(i));
}
for (var j = 0; j < name.length; j++){
getLetterImage(searchtags[j], j);
}
});
关于javascript - flickr 中的图像数组未按预期顺序显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28221484/
有没有办法从具有自定义宽度/高度的 flickr api 获取图像?我发现只有标准功能 flickr.photos.getSizes ,但此函数仅返回预定义的大小。谢谢 最佳答案 据我所知,不可能让
我想从 flickr 上的相册中获取照片。我有 4 张专辑。目前我正在做返回所有照片的 flickr.people.getPublicPhotos 方法。这是我的网址 https://api.flic
通读 Flickr API 文档,它一直说我需要一个 API key 才能使用他们的 REST 协议(protocol)。我只是在构建一个照片查看器,从 Flickr 的 public photo f
是否有一种简单的方法可以使用 Flickr API 而不是编辑界面按时间倒序对照片集进行排序(即“按拍摄日期排列(最新的优先)”? 最佳答案 您可以在调用getPhotos 时获取date_taken
我们需要用户能够在我们的媒体部分输入 URL。然而,由于用户在输入 URL 时可能会出错,我们需要确保这些 URL 是有效的 flickr URL。有效网址例如: http://www.flickr.
编辑:我增加了赏金,如果有人能帮我弄清楚我做错了什么,那就全靠你了。 此外,我真的不在乎这是如何完成的。如果有图书馆可以提供帮助,或者类似的东西,那就太好了。 由于不涉及验证码,理论上我应该能够登录
我正在尝试将我的应用程序连接到 Flickr,但在身份验证过程中遇到问题。 我已按照以下说明进行操作: https://github.com/devedup/FlickrKit 我已经为我的应用程序创
我正在尝试在 iOS 7 中使用 UIActivityViewController Flickr 共享,但 Flickr 图标没有出现在共享表中。我觉得我缺少一些基本的东西。 我正在 iPhone 5
我使用它通过 Flickr API 获取所有相册列表 - flickr.photosets.getList 我需要获取特定相册中所有照片的静态 URL。谁能建议怎么做? 最佳答案 如果您只想获取原始图
菜鸟问题系列... 我是 python 的新手,最近想创建一个小的 python 应用程序,可以根据不同的搜索输入从 flickr 收集照片。 (例如:如果我输入“dog”,它会从 flickr 下载
我想使用rest(jquery ajax - 因为这就是我使用的)在页面上显示 flickr.test.echo 的响应 我需要提供 api_key REST 端点 URL 为 http://api.
我遇到了 flickr API 的一个令人困惑的问题。 当我进行照片搜索 (flickr.photos.search) 并请求高页码时,我 通常会为不同的页码返回重复的照片。 这是三个 URL,它们每
是否可以通过 flickr api 或其他一些服务获取在用户所在位置拍摄的 CC 图像? 就像从浏览器获取经纬度并将其发送到 flickr 然后获取在那里拍摄的图像一样?类似于 iOS 上的雅虎应用程
我正在做一个项目,在这个项目中我在 flickr 上创建了一个应用程序。我的帐户是免费帐户。使用该应用程序。许多用户连接到我的应用程序,我将他们的 access_token 存储在我的数据库中。使用该
是否可以通过api调用或某些脚本从flickr URL获取静态图像URL? 例如: Flickr URL-> http://www.flickr.com/photos/53067560@N00/265
最近,我浏览我的 Flickr 帐户及其统计数据,注意到它们显示了一个非常漂亮的图表。给我留下深刻印象的是它是用 HTML 渲染的,并使用 JavaScript 实现鼠标悬停效果。有谁知道他们是否使用
确定用户是否登录 Flickr 的正确方法是什么?我的应用程序中有一个 iframe,它允许用户从 Flickr 下载他们的图像。但是如果用户没有登录到 flickr,那么 flickr 会将我从 i
我想先说一下,我是 JS 的初学者,现在才使用它几天。 这是我正在处理的内容http://jsfiddle.net/joyroyxw/ 我想要做的是获取一个人的名字并显示他们名字中每个字母的图像。到目
是否有任何 python flickr api,我可以在其中点击组 url 并获取所有最新的图像数据? 我有一个像这样的网址: https://www.flickr.com/groups/caterp
我正在获取 flickr 代码以在我的 html 页面中显示照片流: #flickr_badge_source_txt {padding:0; font: 11px Arial, Helvetic
我是一名优秀的程序员,十分优秀!