javascript - 如何在个人资料图像标签中应用 onchange 图像预览

Question

在我的代码中，我有个人资料图像标签和更新图像的输入标签。

我想为更新个人资料图片选择一个新图像 onchange

<div class="col-sm-6">
    <input type="file" name="userFiles" id="userFiles" class="form-control">
    <div class="text-danger" id="userfile_error" style="display:none;">
    </div>
</div>  
<img width="100" class="img-circle" src="<?php echo base_url() . "User_gallary/" . $user['photo']; ?>" id="myImg">  

$("#myImg").onchange (function(){
    var x = $('#userFiles').val();
    document.getElementById("myImg").innerHTML = + x;
});

Answer 1

您可以使用此代码:-

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('.img-circle').attr('src', e.target.result);
        }

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

$("#myImg").change(function(){
    readURL(this);
});