基于Laravel5.6框架， 多图片上传扩展包

做了很多的外包网站， 有一些是有轮播图功能的，感觉这块的需求挺大的，于是抽时间看文档，自己一边学一边研究， 就把轮播图这块写成了一个小插件的形式，（JS代码是在网上找的）经过自己的雕琢，更改样式终于完成了。之后的Laravel框架， 只要有轮播图这块的需求，就全用这个代替了。下面来看一下介绍吧

 

packagist地址： https://packagist.org/packages/zl0314/jq-batch-upload

GITHUB地址： https://github.com/zl0314/jq-batch-upload

效果截图：

可以自定义图片数量， 和图片允许的宽高，图片预览是以base64的形式预览。可以对上传路径进行配置， 文件名进行配置,可以自定义input隐藏域名称。

安装以后， 执行以下命令， 发布资源文件和配置文件：

php artisan vendor:publish --tag=public --provider=Jq\BatchUpload\JqBatchUploadServiceProvider

php artisan vendor:publish --tag=config --provider=Jq\BatchUpload\JqBatchUploadServiceProvider

别忘记到config/app.php文件加载ServiceProvider:

…..

Jq\BatchUpload\JqBatchUploadServiceProvider::class,

使用：

<div class="form-group">
<label for="">轮播图</label>
<div class="box" id="box"> </div>
</div>

@include('BatchUpload::header')

<script type="text/javascript">
var imgFile = new ImgUploadeFiles('#box', function (e) {
this.init({
MAX: 1, //限制个数
inputName: 'pics',
MH: 800, //像素限制高度
MW: 300, //像素限制宽度
allowSize : '{{intval(ini_get('upload_max_filesize'))*1024*1024}}',
callback: function (dom) {
$.post('/jq-batch-upload/upload', {src: this.imgSrc}, function (res) {
        if(res.success == 1){
            $(dom).attr('realsrc', res.src);
            $(dom).find('input').val(res.src);
        }else{
            alert(res.message);
        }
    }, 'json');
},
remove: function (id) {
var realsrc = $('#batch_upload_' + id).attr('realsrc');
$.post('/jq-batch-upload/delete', {src: realsrc}, function (res) {

}, 'json');
}
});
});
</script>