对于我的投资组合网站,我正在调用一个json对象,解析它并动态构建div。一切正常,但我附加的div没有出现。这是空白的。如果我尝试调整窗口大小,内容会神奇地出现。
Js是 - >根 - > JS - > Main.js(第65行)
$.getJSON('./clients.txt',function(data){
for(var i in data) {
var generated = '
<div id="siteRoll">
<div class="thumb"><img src="clients/'+data[i].thumb+'"></div>
<div class="info">
<span class="title">'+data[i].name+'</span>
<span class="desc">CLIENT : '+data[i].client+'</span>
<span class="desc">TYPE : '+data[i].type+'</span>
<span class="desc2">'+data[i].desc1+'</span>
<span class="desc2">'+data[i].desc2+'</span>
<span class="visit"><a href="'+data[i].url+'" target="_blank">Visit site</a></span>
</div><!-- info -->
</div><!-- siteRoll -->';
$('article#portfolio #sliderPort .swipe-wrap').append(generated);
}
});
有什么想法吗?
答案 0 :(得分:1)
看看这是否有帮助:
$.getJSON('./clients.txt',function(data) {
var htm = null;
for(var i in data) {
htm += '
<div id="siteRoll">
<div class="thumb"><img src="clients/'+data[i].thumb+'"></div>
<div class="info">
<span class="title">'+data[i].name+'</span>
<span class="desc">CLIENT : '+data[i].client+'</span>
<span class="desc">TYPE : '+data[i].type+'</span>
<span class="desc2">'+data[i].desc1+'</span>
<span class="desc2">'+data[i].desc2+'</span>
<span class="visit"><a href="'+data[i].url+'" target="_blank">Visit site</a></span>
</div><!-- info -->
</div><!-- siteRoll -->';
}
$('article#portfolio #sliderPort .swipe-wrap').html(htm);
});
答案 1 :(得分:0)
您似乎在页面加载时构建轮播,但在页面加载后附加其内容。大多数轮播(假设它是一个插件)不会那样工作 - 您需要在构建内容之前显示您的内容。
这个特殊的轮播似乎也会对window.resize做出反应,这就是为什么只有在调整窗口大小并且轮播刷新后才能获取内容的原因。
我看一下refresh()方法,如果插件支持它,并在页面加载后附加动态数据时调用它。