我引入了2个jquery，我把2个合并了就解决了，不知道你是什么问题
解决了，搞了大半天，谢谢啦
我把2个合并了，那个错误解决了
但还是不能传头像浏览器报Failed to load resource: the server responded with a status of 500 (Internal Server Error)
最后那个是美化社区那个视频时候引入的啊
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>laravel app</title>
<link rel="stylesheet" href="/css/bootstrap.css">
<link rel="stylesheet" href="/css/font-awesome.css">
<link rel="stylesheet" href="/css/style.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="/js/jquery.form.js" ></script>
<script src="//cdn.bootcss.com/tether/1.3.6/js/tether.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Laravel app</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="/discussions">首页</a></li>
<li><a href="#about"></a></li>
<li><a href="#contact"></a></li>
<li class="dropdown">
{-- <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <span class="caret"></span></a>--}
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
@if(Auth::check())
<li >
<a id="dLabel" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
{Auth::user()->name}
</a>
<ul class="dropdown-menu" aria-labelledby="dLabel">
<li><a href="/user/avatar"> <i class="fa fa-user"></i> 更换头像</a></li>
<li><a href="#"> <i class="fa fa-cog"></i> 更换密码</a></li>
<li><a href="#"> <i class="fa fa-heart"></i> 特别感谢</a></li>
<li role="separator" class="divider"></li>
<li> <a href="/logout"> <i class="fa fa-sign-out"></i> 退出登录</a></li>
</ul>
</li>
<li><img src="{Auth::user()->avatar}" class="img-circle" width="50" height="50" alt=""></li>
@else
<li ><a href="/user/login">登录 </a></li>
<li><a href="/user/register">注册</a></li>
@endif
</ul>
</div><!--/.nav-collapse -->
</div></nav>
@yield('content')
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>
引入是放在app模板的 版本换了好多个
@extends('app')
@section('content')
<div class="container">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<div class="text-center">
<div id="validation-errors"></div>
<img src="{Auth::user()->avatar}" width="120" class="img-circle" id="user-avatar" alt="">
{!! Form::open(['url'=>'/avatar','files'=>true,'id'=>'avatar']) !!}
<div class="text-center">
<button type="button" class="btn btn-success avatar-button" id="upload-avatar">上传新的头像</button>
</div>
{!! Form::file('avatar',['class'=>'avatar','id'=>'image']) !!}
{!! Form::close() !!}
<div class="span5">
<div id="output" style="display:none">
</div>
</div>
</div>
</div>
</div>
</div><script>
$(document).ready(function() {
var options = {
beforeSubmit: showRequest,
success: showResponse,
dataType: 'json'
};
$('#image').on('change', function(){
$('#upload-avatar').html('正在上传...');
$('#avatar').ajaxForm(options).submit();
});
});
function showRequest() {
$("#validation-errors").hide().empty();
$("#output").css('display','none');
return true;
}
function showResponse(response) {
if(response.success == false)
{
var responseErrors = response.errors;
$.each(responseErrors, function(index, value)
{
if (value.length != 0)
{
$("#validation-errors").append('<div class="alert alert-error"><strong>'+ value +'</strong><div>');
}
});
$("#validation-errors").show();
} else {
$('#user-avatar').attr('src',response.avatar);
$('#upload-avatar').html('更换新的头像');
}
}</script>
@stop
浏览器报错
Uncaught TypeError: $(...).ajaxForm is not a function at HTMLInputElement.<anonymous> (avatar:100) at HTMLInputElement.dispatch (jquery-3.0.0.min.js:3) at HTMLInputElement.q.handle (jquery-3.0.0.min.js:3)
是这个啊
public function changeAvatar(Request $request)
{
$file=$request->file('avatar');
$input = array('image' => $file);
$rules = array(
'image' => 'image'
);
$validator = Validator::make($input, $rules);
if ( $validator->fails() ) {
return \Response::json([
'success' => false,
'errors' => $validator->getMessageBag()->toArray()
]);
}
$destinationPath = 'uploads/';
$filename=\Auth::user()->id.'_'.time().$file->getClientOriginalName();
$file->move($destinationPath,$filename);
\Image::make($destinationPath.$filename)->fit(200)->save();
$user=User::find(\Auth::user()->id);
$user->avatar='/'.$destinationPath.$filename;
$user->save();
return \Response::json([
'success'=>true,
'avatar'=>asset($destinationPath.$filename),
]);
}这是控制器的点上传一直显示正在上传
没有其他错误
/js/jquery.form.js好像没起作用
<script src="/js/jquery-2.1.4.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/jquery.form.js"></script>就是放在之后啊