我应该创建一个控制器文件来显示文件或图片吗？我用锚标签
ct2axkht1#
你不需要一个laravel代码，只需要 AJAX 和jquery：
$.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } }); $.ajax({ url:"{{route('add-image-ajax')}}", type:'POST', data: {'_token' : '{{ csrf_token() }}', 'image': response}, success:function(data){ console.log('Crop image has been uploaded'); $('input[name = uploaded_img]').val(data.success); $("#previewImgTag").attr('src', response); } })
ars1skjm2#
/* 图像预览显示 */
<head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/Dropify/0.2.2/js/dropify.min.js" integrity="sha512-8QFTrG0oeOiyWo/VM9Y8kgxdlCryqhIxVeRpWSezdRRAvarxVtwLnGroJgnVW9/XBRduxO/z1GblzPrMQoeuew==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Dropify/0.2.2/css/dropify.css" integrity="sha512-In/+MILhf6UMDJU4ZhDL0R0fEpsp4D3Le23m6+ujDWXwl3whwpucJG1PEmI3B07nyJx+875ccs+yX2CqQJUxUw==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <script> $(document).ready(function(){ $('.dropify').dropify(); var drEvent = $('#input-file-events').dropify(); var drDestroy = $('#input-file-to-destroy').dropify(); drDestroy = drDestroy.data('dropify') $('#toggleDropify').on('click', function(e) { e.preventDefault(); if (drDestroy.isDropified()) { drDestroy.destroy(); } else { drDestroy.init(); } }); }); }); </script> </head> <body> <div class="col-md-3"> Upload Passport(Max Size 5mb) </div> <div> <input id="passport_docs" class="dropify " name="passport_docs" type="file" value="{{ old('passport_docs') }}" data-allowed-file-extensions="pdf doc docx png jpg jpeg" data-max-file-size="5120K" /> </div> </body> /*and upload data with formData*/ var passport_docs = $("#passport_docs").prop("files")[0]; var form_data = new FormData(); form_data.append("passport_docs", passport_docs); $.ajax({ url:"{{route('add-image-ajax')}}", type: 'POST', cache: false, contentType: false, processData: false, data: form_data, dataType: 'json', success: function (response) { } });
2条答案
按热度按时间ct2axkht1#
你不需要一个laravel代码，只需要 AJAX 和jquery：
ars1skjm2#
/* 图像预览显示 */