如何解决发送请求之前的Laravel预览图像
我想在有人单击提交或保存之前预览上传的图片。我想在发送请求之前预览它。我是这样尝试的:How to show image preview before uploading from controller in php laravel
@extends('layouts.app')
@section('content')
<script>
function readURL(input)
{
if (input.files && input.files[0])
{
var reader = new FileReader();
reader.onload = function (e) {
$('#category-img-tag').attr('src',e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$("#cover_image").change(function(){
readURL(this);});
</script>
<h1>Edit Post</h1>
{!! Form::open(['action' => ['PostsController@update',$post->id],'method' => 'POST','enctype' => 'multipart/form-data']) !!}
{{Form::submit('Submit',['class'=>'btn btn-primary pull-right','name' => 'Submit','value' => 'Submit','style' => 'margin: 10px 10px 10px 10px'])}}
<div class="form-group">
{{Form::label('title','Title')}}
{{Form::text('title',$post->title,['class' => 'form-control','placeholder' => 'Title'])}}
</div>
<div class="form-group">
{{Form::label('body','Body')}}
{{Form::textarea('body',$post->body,['id' => 'article-ckeditor','class' => 'form-control','placeholder' => 'Body Text'])}}
</div>
<div class="form-group">
{{Form::file('cover_image',['id' => 'cover_image','type' => 'file'])}}
<img src="#" id="category-img-tag" width="200px" />
</div>
{{Form::hidden('_method','PUT')}}
{{Form::submit('Speichern',['class'=>'btn btn-secondary','name' => 'Speichern','value' => 'Speichern'])}}
{!! Form::close() !!}
<br>
<div class="col-md-4 col-sm-4" style=" padding: 18px 0px 0px 0px;">
<img style="width:100%" src="/storage/cover_images/{{$post->cover_image}}">
</div>
@endsection
但是javascript无法正常工作,并且
<img src="#" id="category-img-tag" width="200px" />
一旦选择一个,就不会显示图片。 请帮助
Here a picture with what i need
解决方法
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。