PHP部分

  

/*图片上传*/
public function upload1(){
$file = $_FILES['file'];
$upload = new \Think\Upload();// 实例化上传类
$upload->maxSize = 2*1024*1024;
$upload->rootPath = './Uploads/'; // 设置附件上传根目录
$upload->savePath = 'Pc/headerimg/'; // 设置附件上传(子)目录
$info = $upload->uploadOne($file);
$infourl='./Uploads/'.$info['savepath'].$info['savename'];
$image = new \Think\Image();
$image->open($infourl);//将图片裁剪为400x400并保存为corp.jpg
$width = $image->width(); // 返回图片的宽度
$height = $image->height(); // 返回图片的高度
$iw = $ih = 440;
if($iw>$width){
$iw = $width;
}
if($ih>$height){
$ih = $height;
}
if($width>440 || $height>440){
$image->thumb($iw, $ih,\Think\Image::IMAGE_THUMB_CENTER)->save($infourl);
}
exit(json_encode($info));
}
/*剪切图片上传*/
public function uploadImgCut(){
if(IS_POST){
$ileft=$_POST['ileft'];
$itop=$_POST['itop'];
$iw=$_POST['iw'];
$ih=$_POST['ih'];
$jqimg=$_POST['jqimg'];
$image = new \Think\Image();
$image->open($jqimg);
$width = $image->width(); // 返回图片的宽度0
$height = $image->height(); // 返回图片的高度
if($iw>$width){
$iw = $width;
$ileft = 0;
}
if($ih>$height){
$ih = $height;
$itop = 0;
}
if(0 == $iw && 0 == $ih){
exit('{"state":false,"msg":"图片太小"}');
exit();
} $image->crop($iw,$ih,$ileft,$itop)->save($jqimg); $data['headimgurl']=$jqimg; $sessval=session('userInfo');
$id=$sessval['id'];
if($id){
if(M('vip')->where(array('id'=>$id))->save($data)){
$bHtml = '{"state":true,"url":"'.$jqimg.'","msg":"图片上传成功"}';
exit($bHtml);
}else{
exit('{"state":false,"msg":"数据库保存失败"}');
}
} else {
exit('{"state":false,"msg":"用户未登录"}');
} }
exit('{"state":false,"msg":"非法提交"}');
}
HTML部分
<div class="p-content">

    <div class="upload-pic-box">

                 <span class="upload-left">

                        <div class="box">

                         <i class="cut" id="cut" style="display:none;"></i>

                            <!--默认<img src="data:images/uphoto1.png" alt="" style="" />-->

                         <img src="__IMG__/uphoto1.png" alt="" style="" id="imgPrototype"/>

                        </div>

                        <input type="hidden" value="" id="pic_img"/>

                        <a class="upload-btn" href="javascript:;">

                            <cite>点击您要上传的头像</cite>  

                           <p><input type="file" name = "file" id = "file1" onchange="uploadCutImg('imgPrototype','file1','pic_img')"></p>

                        </a>                    

        </span>

                 <span class="upload-right" id='divpicview' class='divpre'>

                     <div class="box">

                            <img src="__IMG__/uphoto2.png" alt="" id="imgView" />

                        </div>

                        <span class="text">尺寸:340*340像素</span><br/>

            <a class="upload-btn" style="cursor:pointer;display:none;" id="doImgCut">

                        <cite>确定</cite>

                        </a>

                 </span>

            </div>

        </div>

AJAX部分下一章...

PHP+JQUERY+AJAX上传、裁剪图片的更多相关文章

  1. Django使用cropbox包来上传裁剪图片

    1.使用cropbox包来上传裁剪图片,可见介绍:https://www.jianshu.com/p/6c269f0b48c0I ImgCrop包包括:css--style.css,js--cropb ...

  2. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  3. jQuery ajax上传文件实例

    jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...

  4. ASP.NET Jquery+ajax上传文件(带进度条)

    效果图 支持ie6+,chrome,ie6中文文件名会显示乱码. 上传时候会显示进度条. 需要jquery.uploadify.js插件,稍后会给出下载 前台代码 <%@ Page Langua ...

  5. flask jQuery ajax 上传文件

    1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > ...

  6. PHP+JQUERY+AJAX上传、裁剪图片(2)

    <script type="text/javascript"> var imgCut = { imgOpt : { imgPrototypeId : 'imgProto ...

  7. jquery ajax 上传文件

    html:<!-- /.tab-pane --> <div class="tab-pane" id="head_portrait"> & ...

  8. jquery +ajax 上传加预览

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. jquery ajax 上传文件和传递参数到一个接口的实现方法

    参考:https://blog.csdn.net/qq_15674631/article/details/81095284 参考:https://www.jianshu.com/p/46e6e03a0 ...

随机推荐

  1. python中静态方法(@staticmethod)和类方法(@classmethod)的区别

    一般来说,要使用某个类的方法,需要先实例化一个对象再调用方法. 而使用@staticmethod或@classmethod,就可以不需要实例化,直接类名.方法名()来调用. 这有利于组织代码,把某些应 ...

  2. 牛客Wannafly挑战赛23F 计数(循环卷积+拉格朗日插值/单位根反演)

    传送门 直接的想法就是设 \(x^k\) 为边权,矩阵树定理一波后取出 \(x^{nk}\) 的系数即可 也就是求出模 \(x^k\) 意义下的循环卷积的常数项 考虑插值出最后多项式,类比 \(DFT ...

  3. BZOJ1970 [Ahoi2005] 矿藏编码

    Description 依次对每份进行编码,得S1,S2,S3,S4.该矿藏区的编码S为2S1S2S3S4. 例如上图中,矿藏区的编码为:2021010210001. 小联希望你能根据给定的编码统计出 ...

  4. Maven学习总结(五):maven命令的含义及用法

    Maven有许多命令,不管是在命令行(1),还是在Myecplise10的Maven项目--右键Run As(2),还是IDEA的左下角--Maven Projects--Maven项目名--Life ...

  5. 关于js的两个函数

    注:这两个函数结合其他主要实现异步的默认checkbox选中和其他选中,从php页面穿过来已经选中的值,用jQuery 回绑:关键点在于$.each(),遍历,再用$.attr() 回绑:第二步关键点 ...

  6. Drupal7配置简洁URL(Clear URL)

    参考:Apache Rewrite url重定向功能的简单配置 这两天折腾死了 首先说一下我的环境: Aache2.4.25-x64-vc14-r1;php-7.0.19-Win32-VC14-x64 ...

  7. 转:Redis和Memcache的区别分析

    Redis和Memcache的区别分析  原文链接:http://blog.csdn.net/u013474436/article/details/48632665 简单区别: 1. Redis中,并 ...

  8. C++学习笔记(2)----类模板和友元

    当一个类包含一个友元声明时,类与友元各自是否是模板是相互无关的.如果一个类模板包含一个非模板友元,则友元被授权可以访问所有模板实例.如果友元自身是模板,类可以授权给所有友元模板实例,也可以只授权给特定 ...

  9. 【Yii系列】Yii2.0的安装与调试

    接上一节的话,我们最终选择了Yii框架作为我们的主要开发框架,今天,我就和大伙来聊聊如何安装与调试Yii2.0,以及后续会和大伙聊聊如何在Yii2.0上快速撸代码. Yii2.0的安装 好的,Comp ...

  10. 【分享·微信支付】 C# MVC 微信支付教程系列之公众号支付

    微信支付教程系列之公众号支付           今天,我们接着讲微信支付的系列教程,前面,我们讲了这个微信红包和扫码支付.现在,我们讲讲这个公众号支付.公众号支付的应用环境常见的用户通过公众号,然后 ...