在laravel5.2中实现点击用户头像更改头像的方法

时间:2021-05-25

视图层

!!!自己下载jquery文件和ajaxfileUpload的插件

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> </style></head><script type="text/javascript"> //下面用于图片上传预览功能 function setImagePreview(avalue) { var docObj=document.getElementById("doc"); var imgObjPreview=document.getElementById("preview"); if(docObj.files &&docObj.files[0]) {//火狐下,直接设img属性 imgObjPreview.style.display = 'block';//imgObjPreview.src = docObj.files[0].getAsDataURL();//火狐7以上版本不能用上面的getAsDataURL()方式获取,需要一下方式 imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]); } else {//IE下,使用滤镜 docObj.select(); var imgSrc = document.selection.createRange().text; var localImagId = document.getElementById("localImag");//必须设置初始大小 localImagId.style.width = "150px"; localImagId.style.height = "180px";//图片异常的捕捉,防止用户修改后缀来伪造图片 try{ localImagId.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)"; localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc; } catch(e) { alert("您上传的图片格式不正确,请重新选择!"); return false; } imgObjPreview.style.display = 'none'; document.selection.empty(); } ajaxFileUpload(); //上传图片 return true; }</script><body><center> <label> @foreach ($arr as $key=>$val) {{-- <img src="{{$val->n_img}}" alt="" height="100" width="100" class="qq"> <input type="file" id="file1" style="VISIBILITY: hidden" >--}} <img id="preview" width="100" height="100" src="{{$val->n_img}}"> <input type="file" name="touxiang" id="doc" style="display:none" οnchange="javascript:setImagePreview();"> @endforeach </label></center></body></html><script src="./js.js"></script><script src="./ajaxfileupload.js"></script><script type="text/javascript"> function ajaxFileUpload() { $.ajaxFileUpload ( { url: "{{url('up_img')}}", //用于文件上传的服务器端请求地址 secureuri: false, //是否需要安全协议,一般设置为false fileElementId: 'doc' } ); return false; }</script>

控制器层

<?phpnamespace App\Http\Controllers;use Illuminate\Http\Request;use App\Http\Requests;use DB;use Illuminate\Support\Facades\Input;class ImgController extends Controller{ public function Index(){ $arr= DB::select("SELECT * FROM r_nav limit 1"); return view('index',['arr'=>$arr]); } //修改图片 public function up_img(Request $Request){ $n_file = Input::file('touxiang'); if($n_file->isValid()){ //获取文件名称 $clientName = $n_file -> getClientOriginalName(); $realPath = $n_file -> getRealPath(); //获取图片格式 $entension = $n_file -> getClientOriginalExtension(); //图片保存路径 $mimeTye = $n_file -> getMimeType(); $path = $n_file -> move('IMG'); } $ress = DB::table('r_nav')->where('n_id',11)->update(['n_img'=>$path]); }}

以上这篇在laravel5.2中实现点击用户头像更改头像的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章