记录上传图片遇到的一些坑（以此为戒）

使用的都是layui.upload

这是写在HTML(普通上传图片):

<div class="form-group">
    <label class="col-sm-3 control-label">身份证正面照片：</label>
    <div class="col-sm-9">
        <div class="layui-upload">
            <button type="button" class="layui-btn" id="btncardPhoto">上传图片</button>
            <input id="cardPhoto" name="cardPhoto" type="hidden" value=""/>
            <div class="layui-upload-list">
                <img class="layui-upload-img fieldimg" id="imgcardPhoto" src="">
            </div>
        </div>
    </div>
</div>

js:

//身份证上传图片--------------------
var url = ctx + 'common/upload';
var upload = layui.upload; //得到 upload 对象
layui.use('upload', function () {
    var upload = layui.upload;
    //执行实例
    var uploadInst1 = upload.render({
        elem: '#btncardPhoto' //绑定元素
        , url: url //上传接口
        , done: function (res) {//res可以在common/upload接口设置，我接收的是图片的访问路径
            //上传完毕回调
            if (res.msg == "操作成功") {
                $('#cardPhoto').val(res.url);
                $('#imgcardPhoto').attr("src",res.url);
            }
        }
        , error: function () {
            alert("上传失败~");            
        }
    });
    //执行实例2
    var uploadInst2 = upload.render({
        ...此处省略以上重复代码
    });
});

以下的上传看着舒服些：

<div class="form-group">
    <label class="col-sm-3 control-label">营业执照照片：</label>
    <div class="col-sm-9">
        <div class="w-h-100">
            <div class="uploadForm">
                <div id="upload"></div>
            </div>
        </div>
    </div>
    <input id="businessPhoto" name="businessPhoto" type="hidden">
 </div>
</div>

js:

var options = {
    path: ctx + 'common/upload/img?type=11', // 上传图片时指定的地址路径，类似form变淡的action属性
    onSuccess: function(res) { // 上传成功后执行的方法，res是接收的ajax响应内容
        res = JSON.parse(res);
        $('#businessPhoto').val(res.data);
    },
    onFailure: function(res) { // 上传失败后执行的方法，res是接收的ajax响应内容
        alert("上传失败~");
    }
};
$('#upload').on('change', function() {
    upload();
});
var upload= tinyImgUpload('#upload', options);//tinyImgUpload函数在tinyImgUpload.js里，请先引用

 主要的坑就是上传的路径，有的项目图片的上传地址是固定的，请先更改: