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


Posted in PHP onOctober 14, 2019

视图层

!!!自己下载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>

控制器层

<?php

namespace 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中实现点击用户头像更改头像的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
第十节 抽象方法和抽象类 [10]
Oct 09 PHP
php&amp;java(三)
Oct 09 PHP
php面向对象全攻略 (十) final static const关键字的使用
Sep 30 PHP
PHP游戏编程25个脚本代码
Feb 08 PHP
使用PHP和JavaScript判断请求是否来自微信内浏览器
Aug 18 PHP
php 变量引用与变量销毁机制详细介绍
Dec 05 PHP
PHP7多线程搭建教程
Apr 21 PHP
php下载远程大文件(获取远程文件大小)的实例
Jun 17 PHP
PHP有序表查找之二分查找(折半查找)算法示例
Feb 09 PHP
php原生数据库分页的代码实例
Feb 18 PHP
浅谈php调用python文件
Mar 29 PHP
TP5框架实现自定义分页样式的方法示例
Apr 05 PHP
Yii框架数据库查询、增加、删除操作示例
Oct 14 #PHP
laravel框架上传图片实现实时预览功能
Oct 14 #PHP
解决laravel上传图片之后,目录有图片,但是访问不到(404)的问题
Oct 14 #PHP
yii框架数据库关联查询操作示例
Oct 14 #PHP
laravel实现上传图片并在页面显示的例子
Oct 14 #PHP
Thinkphp5.0 框架的请求方式与响应方式分析
Oct 14 #PHP
laravel 多图上传及图片的存储例子
Oct 14 #PHP
You might like
《星际争霸2》终章已出 RTS时代宣告终结
2017/02/07 星际争霸
MySQL数据库转移,access,sql server 转 MySQL 的图文教程
2007/09/02 PHP
php截取utf-8中文字符串乱码的解决方法
2010/03/29 PHP
php 使用post,get的一种简洁方式
2010/04/25 PHP
PHP读取XML值的代码(推荐)
2011/01/01 PHP
Firefox中beforeunload事件的实现缺陷浅析
2012/05/03 Javascript
JavaScript实现的简单幂函数实例
2015/04/17 Javascript
基于javascript实现listbox左右移动
2016/01/29 Javascript
bootstrap学习使用(导航条、下拉菜单、轮播、栅格布局等)
2016/12/01 Javascript
又一款MVVM组件 构建自己的Vue组件(2)
2017/03/13 Javascript
JavaScript中splice与slice的区别
2017/05/09 Javascript
详解Angular中实现自定义组件的双向绑定的两种方法
2018/11/23 Javascript
超详细的5个Shell脚本实例分享(值得收藏)
2019/08/15 Javascript
Vue实现图片与文字混输效果
2019/12/04 Javascript
[06:53]2018DOTA2国际邀请赛寻真——勇于创新的Vici Gaming
2018/08/14 DOTA
[48:48]完美世界DOTA2联赛PWL S3 Magama vs GXR 第一场 12.19
2020/12/24 DOTA
python删除列表中重复记录的方法
2015/04/28 Python
python 不以科学计数法输出的方法
2018/07/16 Python
Django利用cookie保存用户登录信息的简单实现方法
2019/05/27 Python
python和php哪个更适合写爬虫
2020/06/22 Python
python3跳出一个循环的实例操作
2020/08/18 Python
python实现模拟器爬取抖音评论数据的示例代码
2021/01/06 Python
PyCharm2020.3.2安装超详细教程
2021/02/08 Python
sklearn中的交叉验证的实现(Cross-Validation)
2021/02/22 Python
CSS3中currentColor关键字的妙用
2016/02/27 HTML / CSS
HTML5自定义属性前缀data-及dataset的使用方法(html5 新特性)
2017/08/24 HTML / CSS
SQL Server数据库笔试题和答案
2016/02/04 面试题
一组SQL面试题
2016/02/15 面试题
毕业自荐书
2013/12/09 职场文书
秋季婚礼证婚词
2014/01/11 职场文书
模范家庭事迹材料
2014/02/10 职场文书
公司联欢会策划方案
2014/05/19 职场文书
管理失职检讨书
2015/05/05 职场文书
《给予树》教学反思
2016/03/03 职场文书
优秀创业计划书分享
2019/07/19 职场文书
Python 中的Sympy详细使用
2021/08/07 Python