所以,我有图像元数据的表时,页面加载时动态从API调用建成,并上传新的图像,构建表被再次调用,包括新的图像数据的功能后。然而,对于列宽的CSS样式没有显示在网页上(即使它看起来完全正常的检查元素!)。为列,如表后text-align
工作的其他方式进行重建。刷新页面显示正确的样式。以下附件是我的功能。
function getMedia(blockName) {
$(".illustrationsContent").empty();
$("#filterTestKey").empty();
$.ajax({
url: [url] + blockName.trim(),
type: 'GET',
dataType: 'json',
async: false,
success: function (media) {
var testKeys = [];
if (media.length > 0) {
$(".illustrationsNoContent").hide();
} else {
$(".illustrationsNoContent").show();
}
for (var i = 0; i < media.length; i++) {
var newRow = "<tr class='illustrationsContent'><td style='width: 20%;'>" + media[i].Question + "</td>"
+ "<td>" + media[i].Name + "</td>"
+ "<td style='text-align: center; width: 15%'>" + "<button type='button' class='delete' disabled>Delete</button>" + "</td></tr>";
testKeys.push(media[i].Question);
$("#illustrationsTable tbody").append(newRow);
}
testKeys = jQuery.uniqueSort(testKeys);
if (testKeys[0] == blockName) {
$("#filterTestKey").hide();
$("#TestKeyLabel").show();
} else {
$("#TestKeyLabel").hide();
$("#filterTestKey").append(new Option("All Test Keys", "All Test Keys"));
for (var i = 0; i < testKeys.length; i++) {
$("#filterTestKey").append(new Option(testKeys[i], testKeys[i]));
}
}
}
});
}
谢谢
使用CSS类,而不是style
属性。此外,确保HTML被正确地呈现。
所以,我看着DOM变化密切,并注意到$(".illustrationsContent").empty();
没有删除旧行。改变它$(".illustrationsContent").remove();
解决了造型问题(虽然我不得不承认我不完全知道如何)。