时间戳

首页 > 解决方案 > 未捕获的 ReferenceError：未在 HTMLInputElement.onchange 中定义 readURL

javascript - 未捕获的 ReferenceError：未在 HTMLInputElement.onchange 中定义 readURL

问题描述

我正在尝试将图像元素的 src 更改为以文件形式上传的图像，但是，当我选择图像时，出现错误Uncaught ReferenceError: readURL is not defined at HTMLInputElement.onchange并且图像元素的 src 没有改变。

HTML

        <div class="new-avatar-container">
            <img class='new-avatar-picture' src='{{url("storage/uploads/profile_pictures/edited/".$user->image_file_name)}}'>
            <div class="upload-btn-wrapper">
                <button class="btn">Upload a new avatar</button>
                <input class='new-avatar' type="file" name="file" onchange="readURL()">
            </div>
        </div>

Javascript

function readURL(input) {

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

            reader.onload = function(e) {
                $('.profile-container-picture').attr('src', e.target.result);
            }

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

    $(".new-avatar").change(function() {
        readURL(this);
    });

标签： javascriptjquery

解决方案

尝试将您的功能添加到：

$(document).ready(function(){
   readURL = function(input) {}
});

当您尝试调用它时，您的函数可能不存在

推荐阅读