Javascript 提交时更改图像源

我想在单击submit按钮时更改innerHtml数据中的图像源

<div id="areaEditor">
    <div class="holder">
        <img src="blob.blob"/>
        <input class="filesss" type="file" value="one.jpg"/>
    </div>

    <div class="holder">
        <img src="blob.blob"/>
        <input class="filesss" type="file" value="two.jpg"/>
    </div>

    <div class="holder">
        <img src="blob.blob"/>
        <input class="filesss" type="file" value="three.jpg"/>
    </div>
</div>


$('#newsButton').click(function(e){
    e.preventDefault();
    alert("klik");

    var source = $(".holder").find(".filesss").val();
    var imageTag = $(".holder").find("img").attr("src",source);
    var htmlData = $("#areaEditor").html();

    alert(htmlData);

})

$（“#新闻按钮”）。单击（函数（e）{
e、 预防默认值（）；
警报（“klik”）；
var source=$（“.holder”）.find（“.filess”）.val（）；
var imageTag=$（“.holder”）.find（“img”）.attr（“src”，source）；
var htmlData=$（“#区域编辑器”）.html（）；
警报（htmlData）；
})

但是，那里的htmlData I警报只显示所有三个图像标记的img src是one.jpg

如何进行校正，使图像src基于每个最近的输入文件

---

非常感谢您的帮助。

您有许多

.holder

元素，您应该循环它们，并获取每个元素的

.filesss

值，并按如下方式替换图像src：

$('#newsButton').click(function(e){
    e.preventDefault();
    alert("klik");

    $(".holder").each(function() {
        var source = $(this).find(".filesss").val();
        $(this).find("img").attr("src", source);
    });

    var htmlData = $("#areaEditor").html();
})

---

其思想是在元素上循环，以便在您的情况下，每次都可以取一个值；您告诉JQuery从类

holder

中获取源代码，它在第一个元素中找到该类，因此它不需要查找任何其他内容

因此，您可以执行以下操作：

    <div id="areaEditor">
        <div class="holder">
            <img src="blob.blob"/>
            <input class="filesss" type="file" value="one.jpg"/>
        </div>

        <div class="holder">
            <img src="blob.blob"/>
            <input class="filesss" type="file" value="two.jpg"/>
        </div>

        <div class="holder">
            <img src="blob.blob"/>
            <input class="filesss" type="file" value="three.jpg"/>
        </div>
    </div>
  <script>  
    $('#newsButton').click(function(e){
        e.preventDefault();
        alert("klik");

        $(".holder").each(function() {
            var source = $(this).find(".filesss").val();
            $(this).find("img").attr("src",source);
        });

        var htmlData = $("#areaEditor").html();
        alert(htmlData);
    })
</script>

$（“#新闻按钮”）。单击（函数（e）{
e、 预防默认值（）；
警报（“klik”）；
$（“.holder”）。每个（函数（）{
var source=$（this.find（“.filess”）.val（）；
$（this.find（“img”）.attr（“src”，source）；
});
var htmlData=$（“#区域编辑器”）.html（）；
警报（htmlData）；
})

谢谢您的帮助。我应该在问之前试一下没有问题。很乐意帮忙：）