0

我遇到了 jQuery 的一种情况。特别是它的 prettyPhoto 库和 getJSON 函数。

我有一个加载 HTML 的页面，它调用 jQuery 和 prettyPhoto。有一些内联 JS 在页面下方发出 JSON 请求：

它应该像下面这样工作：

1）页面加载，

2）Javascript代码运行，

3) 脚本运行一个 jQuery JSON 请求，该请求返回并在其中包含 HTML（每个 a-tag 中的 a-tags 和图像），

4) 脚本然后将 JSON 内部的 HTML 打印到屏幕上，

5) 用户单击 a-tag/image 并在 prettyPhoto 的 iframe 弹出窗口中打开。

注意 -> 每个 a-tag 都附加了一个 prettyPhoto id（使用 iframe 弹出窗口将图像加载到 prettyPhoto 中）。

问题是图片（链接）没有用 prettyPhoto 打开，我不知道为什么。没有 JS 错误。

但是，如果我手动拥有已经存在的 HTML（a-links/image），它确实有效（所以只是从 JSON 请求中加载它们的 HTML 似乎会有所不同）。

似乎 JSON 请求返回（带有 HTML）prettyphoto 已经绑定到 a-tags（或缺少关闭）。

到目前为止测试过：

尝试将 JSON 请求放入“document.ready”并将 prettyPhoto 放入“window.load”。JSON 请求也是如此，当其他所有内容加载时，prettyPhoto 也会绑定 - 失败

尝试使用 jQuery AJAX 而不是 JSON - 失败

特别不需要代码，但逻辑有问题。

4

1 回答 1

1

听起来来自 JSON（a-links/images）的 HTML 没有足够快地返回（在“window.load”运行之前）。

尝试将 prettyPhoto JS 放入成功回调中（即返回数据的位置）。

load_images.json 下面是您执行的 JSON 请求，它返回 HTML（a 链接及其图像）：

$.getJSON("load_html.json", function() {
    //grab HTML data (images/a-links) from json file and print into page
})
.success(function() { 
    //JS code running prettyPhoto inside here. Now will bind to a-links.
});

PrettyPhoto 现在在 JSON 加载它们之后绑定到 A 链接。

希望将有助于在链接之后获得漂亮的照片。

如果失败，请尝试将 prettyPhoto 代码放在成功回调之后发生的完整回调中。像下面这样：

$.getJSON("load_html.json", function() {
    //grab HTML data (images/a-links) from json file and print into page
})
.success(function() { 
    //nothing
})
.complete(function() {
     //JS code running prettyPhoto inside here. Now will bind to a-links.
});

这样，您就可以给 prettyPhoto 足够的时间绑定到为其标记的正确 a 链接。

试试看。

于 2013-01-20T14:50:02.653 回答