javascript - 为什么无法使用 ajax 调用的响应更新 html img src

Question

我有一些 html，其中包含一个 table 和一些 tr 行，每行都有一个 td 元素，其中包含 img 元素。在页面的其他地方，我有一个 ajax 方法，它将 url 发送到服务器，然后服务器将其保存在本地并返回位置。

然后，我尝试使用新的 url 更新每个 img 元素的 src 属性元素，但没有任何更新。我的调试警报调用显示找到了图像元素并返回了正确的位置，但不知道我做错了什么。

HTML

  <table class="edittable" id="ARTWORK_TABLE">
    <tr>
        <th class="tableheading verysmallinputfield" style="position:relative">
            <label>
                #
            </label>
        </th>
        <th class="tableheading verysmallinputfield" style="position:relative">
            <label>
                Replace
            </label>
        </th>
        <th class="tableheading verylargeinputfield" style="position:relative">
            <label>
                Filename
            </label>
        </th>
        <th class="tableheading mediuminputfield" style="position:relative">
            <label>
                Artwork
            </label>
        </th>
    </tr>
    <tr id="menu_artwork1">
        <td class="tableheading">
            0
        </td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <label>
                E:\Music\Tango in the Night\02 - Seven Wooooooonders.WAV
            </label>
        </td>
        <td>
            <img src="images/51sjc9qpk4oqFYZdroM04w==_thumbnail.jpg" width="32px" height="32px" title="600 x 585">
            <label>
                600 x 585
            </label>
        </td>
    </tr>
    <tr id="menu_artwork2">
        <td class="tableheading">
            1
        </td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <label>
                E:\Music\Tango in the Night\03 - Everywhere.WAV
            </label>
        </td>
        <td>
            <img src="images/51sjc9qpk4oqFYZdroM04w==_thumbnail.jpg" width="32px" height="32px" title="600 x 585">
            <label>
                600 x 585
            </label>
        </td>
    </tr>
.........

Javascript Ajax函数

function sendFormData(urls)
{
    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/editsongs.update_artwork', false);
    xhr.setRequestHeader("Content-type", "text/plain");
    xhr.send(urls[0]);
    var images = document.getElementById("ARTWORK_TABLE").getElementsByTagName("img");
    alert("Found img"+images.length);
    for(image in images)
    {
        alert(xhr.responseText);
        image.src = xhr.responseText;
    }
}

Answer 1

尝试改变

image.src = xhr.responseText;

至

images[image].src = xhr.responseText;

参见https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in了解更多详情