更新页面上的 html 元素而不回发

Question

我在 javascript 中动态生成 html。我的 html 正在关注

<table id="tr1">
 <tbody>
 <tr><td><img src="D:\listhell\adimg\autos\76cecc74-733d-4794-af6c-caca4d0bfd45.jpg" style="width:50px;"></td></tr>
<tr><td><img src="D:\listhell\adimg\autos\a84b01e3-7811-4897-8e4b-fa351ddd4aca.jpg" style="width:50px;"></td></tr>
<tr><td><img src="D:\listhell\adimg\autos\02ab6f2d-5a26-40a6-bcef-a18ce10dd14d.jpg" style="width:50px;"></td></tr>
<tr><td><img src="D:\listhell\adimg\autos\c47516b8-c265-4d68-a41c-fc74ade50ab7.jpg" style="width:50px;"></td></tr>
<tr><td><img src="" style="width:50px;"></td></tr></tbody></table>

我正在使用这样的 javascript 生成它

  function uploadComplete() {
        var v = $.cookie("path").split(',');
        for (i = 0; i < v.length; i++) {

            $("#tr1").append("<tr><td><img src='" + v[i] + "' style='width:50px;' /></td></tr>");

        }
        alert("completed");


    }

uploadComplete() 是一个 javascript 事件，它在使用 ajax 文件上传控件上传文件时发生。

问题是在 Chrome 中生成了 html，我使用检查元素看到它，但在浏览器 UI 中它没有显示。在 Firefox 中，表格会显示在浏览器的 ui 中，但没有加载图像。

任何建议、意见、建议都会有所帮助，谢谢

Answer 1

你必须这样做：

$("#tr1 tbody").append("<tr><td><img src='" + v[i] + "' style='width:50px;' /></td></tr>");

您需要将行附加到 tbody 而不是直接在表内

Answer 2

试试这个：

$('#tr1 tr')
   .last()
   .after("<tr><td><img src='" + v[i] + "' style='width:50px;' /></td></tr>");