多图上传php通用插件
所属分类:其他  创作类型:原创  作者:呆猫  发布时间:2018-06-01 08:24:33
895 25
本站所有插件都是基于jquery或php的,不依赖其他任何框架,可以集成到大部分网站上。如果有问题可以联系技术
QQ:635081743 微信:wangbin676243
Chrome Firefox Safari IE8+ PHP5.4+
描述:这是一款php+jquery的多图上传插件,可以集成到任何php > 5.4的网站上,使用非常简单

使用步骤

第一步

加载必要的资源文件

<link rel="stylesheet" href="./yanPhotosUploader/yanPhotosUploader.css">
<script src="jquery-1.9.1.js"></script>
<script src="./depend/jquery.ajaxfileupload.min.js"></script>
<script src="./yanPhotosUploader/yanPhotosUploader.min.js"></script>

第二步

html结构

<div class="demo demo1">
    <div class="yanPhotosUploader_item yanPhotosUploader_control">
        <i>+</i>
        <input type="file" name="filePhoto">
    </div>
</div>

第三步

js调用

$('.demo1').yanPhotosUploader({
   action:'upload1.php',
    name:'photos[]'
});

第四步

php脚本调用

define('ROOT_PATH',__DIR__.'/../../');
require_once ROOT_PATH.'/yan/Yan.php';
$thumbUploader = new \yan\plugins\thumbUploader\ThumbUploader([
         'name'=>'filePhoto',
        'savePath'=>ROOT_PATH.'/data/tmp',
        'saveUrl'=>'/data/tmp',
        'extensions'=>['jpg','png','gif'],
        //'resize'=>[100,100,\yan\base\image\YanImage::NONE]
]);
$result = $thumbUploader->run();
header('Content-type:application/json');
echo  json_encode($result);

js参数说明

action 上传脚本路劲
params 额外的上传参数
resultSelector 图片容器,如果制定的话,图片会放到这个容器中
telText 删除文字,默认“删除”
name 表单属性名称,默认photos[],注意:后面的[]不能省略,不然服务端接收不到

php参数说明

savePath 保存路径
saveUrl 保存url,用来返回给客户段
savePlan 保存方案,可以定制一些图片保存方案,如生成两张图片
'savePlan'=>[
    'big'=>[200,200,\yan\base\image\YanImage::NONE],
    'small'=>[100,100,\yan\base\image\YanImage::NONE],
],
        
maxSize 图片最大大小
minSize 图片最小大小
minWidth 图片最小宽度
maxWidth 图片最大宽度
minHeight 图片最小高度
maxHeight 图片最大高度
extensions 图片的扩展类型
相关插件
图片采集图片展示jquery插

这个一款jquery图片展示原创插件,可以用来展示图集,非常适合...

简单弹框查看图片的jquery

这是一款图片弹窗查看插件,只要简单的设置一个yanImageShow c...

yanSlide超级轮播插件

这是一款基于jquery的幻灯轮播焦点图插件,一网打尽所有轮播效...

jquery+php图片上传通用插

这是一款基于jquery+php的图片上传插件,可以用在头像,封面上...

共有1条评论 (最后回答:292天前)