0

在这里，我试图从用户那里获取签名文件并保存到数据库中，但是在提交表单时遇到了问题。我正在尝试获取图像文件并在选择文件时将其显示在屏幕上。当我们选择图像时，它会在屏幕上显示图像。当我提交表单时，请求获取空文件。我无法找到问题所在或问题所在，所以我在下面附上了我的代码。

html代码

<div style="width: 90%; height: 100px; border: 2px dashed black; background: #c6c6c6;  border-radius: 5px;"><img src="#" style="width: 90%; height: 100px;" id="signatureImage"></div>
<input class="btn btn-outline-primary border-0 waves-effect waves-light" type="button" id="get_sign" value="Upload">
<input type="file" name="signature" onchange="readSignURL(this);" accept="image/gif, image/jpeg, image/png" id="signatureFile">

javascript

document.getElementById('get_sign').onclick = function() {
            document.getElementById('signatureFile').click();
        };
        
        function readSignURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    
                    $('#signatureImage')
                        .attr('src', e.target.result)
                        .css('display','block')
                        .width(300)
                        .height(100);
                    
                };

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

控制器

dd($request->file('signature'));

输出

屏幕上显示的图像 表单提交输出

4

0 回答 0