我选择的图像没有出现在预览中

安德里亚·马埃斯特鲁蒂

我是 javascript 和 jquery 的新手。问题是：当我选择一个图像时，它不会立即出现在预览中。我用这段代码部分解决了这个问题：

document.getElementById("id_shield_image").onchange = function () {
            var reader = new FileReader();

            reader.onload = function (e) {
                if($("#parameters_edit_form img").length != 0){

                    $("#parameters_edit_form img").attr('src', e.target.result);
                }
            };

            reader.readAsDataURL(this.files[0]);
        };

现在，只有在有另一个图像时才会出现图像，但是如果我第一次这样做，它就不起作用。

这是表单的 HTML：

<div id="main-content" class="col-12">
    <div class="row">
        <div class="col-12">
            <form id="parameters_edit_form" enctype="multipart/form-data" method="POST">
                {% csrf_token %}
                {% bootstrap_form %}
            </form>
        </div>
    </div>
</div>

任何人都可以帮忙吗？提前致谢！

斯奎格斯。

根据共享的有限 HTML 猜测，您需要在该元素不在页面上时创建该元素。

document.getElementById("id_shield_image").onchange = function () {
            var reader = new FileReader();

            reader.onload = function (e) {
                if($("#parameters_edit_form img").length != 0){

                    $("#parameters_edit_form img").attr('src', e.target.result);
                }else{
                    var img = $('<img>');
                    img.attr('src', e.target.result);
                    img.appendTo('#parameters_edit_form');
                }
            };

            reader.readAsDataURL(this.files[0]);
        };

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。