我创建了一个图像滑动库,当用户按下左/右箭头时,一个图像滑出,新图像滑入。效果很好。
所有相关的图像和描述都在我的 PHP 文件中。现在我想要一些新图像,我发现添加和修改这些内容花费的时间比预期的要长。
所以我决定删除所有图像标记并为图像创建一个 JSON 文件:
这是我用来检索数据并将其注入 DOM 的代码
$.getJSON('data.txt', function(data) {
var len = data.length, i; for (i = 0; i < len; i += 1) {
$("#image_container").append(
'<div class="image_frame"><img class="image" src="' + data[i].image + '" width="620px" alt="' + data[i].alt + '">
<div class="caption"></div><div class="innercaption"><p><span>' + data[i].category +
'</span> |' + data[i].title + '</p></div><div class="caption2"></div><div class="innercaption2">
<p><span>Description</span> | ' + data[i].description + '</p></div></div>' );
};
});
它在文档准备好开始时运行 - 但现在滑动箭头不起作用,但不会产生错误。
我的猜测是,这将是因为内容是与滑块代码同时创建的。所以,他们看不到对方。
有没有办法解决这个问题(也许以滑块代码可以看到的方式运行 getJSON)?