<table style="border: none; margin-top: 40px; width: 100%;">
<tr>
<td id="adparser" style="width: 74.5%;"/>
<td id="thumbnailsSection" style="border: 2px solid black; display: none;">
<div style="text-align: center;">
<img src="arrow-right.png" style="border: 1px solid black; float: left; width: 16px; height: 16px;"/>
Identified Ads
</div>
<ol id="thumbnailsList" style="list-style-type: none;">
<div class="thumbnail">
<img src="https://s3.amazonaws.com/hiro-marketplace/thumb/413ce7c54ae87f9644b27a6d38790c2a.png"
style="width: 256px; height: 256px;"/><br/>
More Details<span><img src="play.png" style="width: 24px; height: 24px;"/></span>
</div>
<!-- More items... -->
</ol>
</td>
</tr>
</table>
好的,所以 #thumbnailsSection 以"显示:无"开头。 后:
function requestChainsButtonClicked()
{
$.ajax(
{
type: "GET",
url: "json_simple.json" + queryString,
success: function(data,status,XMLHttpRequest)
{
if (($.isArray(data))&&(data.length>0)&&($.isPlainObject(
data[0])))
{
nodeID=0;
chartConfig.nodeStructure=buildTreeNode(data[0]);
}
new Treant(chartConfig);
$(".viewCell").click(viewThumbnailsClicked);
}
});
因此,当用户单击按钮时,将生成第一个表格单元格的内容,当用户单击其中一个 .viewCell 按钮(这是第一个单元格中树的一部分(时:
function viewThumbnailsClicked()
{
$.ajax(
{
type: "GET",
url: "thumbnails.json",
error: function(XMLHttpRequest,status,message)
{
$("#thumbnailsSection").css("display","none");
alert(status + ": " + message);
},
success: function(data,status,XMLHttpRequest)
{
var thumbnailsListSelector=$("#thumbnailsList");
thumbnailsListSelector.empty();
if ($.isArray(data))
{
for (var index=0;index<data.length;index++)
{
var thumbnailHTML="<div class="thumbnailItem">";
thumbnailHTML+="<img class="thumbnail" src="";
thumbnailHTML+=data[index].thumbUrl + ""/><br/>";
thumbnailHTML+="More Details<span><img src="";
thumbnailHTML+="play.png" class="details"/>";
thumbnailHTML+="</span></div>";
thumbnailsListSelector.append(thumbnailHTML);
}
}
$("#thumbnailsSection").css("display","table-cell");
}
});
因此,我希望第二个表格单元格 (#thumbnailsSection( 在我单击按钮时立即出现,但它没有发生!只有在我再次单击构建第一个表格单元格的按钮后,才会显示第二个。
问题到底出在哪里?我是否需要在表格上进行一些刷新才能看到第二个单元格?谢谢。
在 ajax 成功时尝试一下,但我不确定
$("#thumbnailsSection").css("display","table-cell");
var thumbnailsListSelector=$("#thumbnailsList");
thumbnailsListSelector.empty();
if ($.isArray(data))
{
for (var index=0;index<data.length;index++)
{
var thumbnailHTML="<div class="thumbnailItem">";
thumbnailHTML+="<img class="thumbnail" src="";
thumbnailHTML+=data[index].thumbUrl + ""/><br/>";
thumbnailHTML+="More Details<span><img src="";
thumbnailHTML+="play.png" class="details"/>";
thumbnailHTML+="</span></div>";
thumbnailsListSelector.append(thumbnailHTML);
}
}