ajaxaupload上传、预览插件支持多图

第一种方式：ajaxupload插件（适合pc版也适合app，兼容IE7）

接口：http://fans-home.chenhua.cc/upload/index

HTML代码为：

<div class="rowNew cl">
                      <lable class="form-label"><span class="c-red">*</span>活动封面：</lable>
                      <div class="formControls">
                           <div class="btn_upload" id="uploadID">
                                 <input class="input-text upload-url radius" type="text" name="textCover" id="textCover" readonly="" nullmsg="请添加附件" style="width: 300px; display:none ">
                                 <a href="javascript:void();" class="uploadBtn_ch"><i class="hui_jia">+</i><em>上传封面</em></a><input type="file" multiple="" name="fileCover" id="fileCover" class="input_file">    
                           </div>
                           <div class="coverImg" id="previewid"></div>
                           <span class="uploadTit">文件尺寸：1234*5678，可用扩展名：JPG JPEG PNG</span>
                      </div>
                  </div>

JS代码为：

$(document).on('change', '#fileCover', function() {
        if(typeof FileReader != null && typeof FileReader != undefined && this.files) {//html5特性
            $.ajaxfileupload({
                url:'/upload/index',
                dataType:'json',
                fileElementId:'fileCover',
                success:function(data){
                    var data=eval(data.data[0]);
                     $('#previewid').html('<div class="coverPop" id="coverDetle"><img src="/upload/attachment/forum/'+data.attachment+'"><a href="javascript:void(0)" class="coverDetele icon-cw" id="coverDetele" onclick="shell.hideK()"></a></div>');
                     $('.btn_upload').hide();
                },
                error: function() {
                    alert('数据有问题');
                }
            });
        }

    });

源用了ajaxfileupload插件

本地效果为：desk/plug/ajaxupload/demo.html

 

 第二种方式：

 

第二种方式：待研究：jQuery php图片上传预览插件_头像上传预览代码   http://www.17sucai.com/pins/13573.html

第三种方式：待研究  jquery图片上传预览插件支持多图片上传预览代码   http://www.17sucai.com/pins/9739.html

第四种方式：待研究  http://www.17sucai.com/pins/tag/883.html

第五种方式：待研究   jQuery+php实现ajax文件即时上传    http://www.helloweba.com/view-blog-189.html

第六种方式：待研究   百度上传文件   https://www.baidu.com/p/setting/profile/portrait

第七种方式：

第八种方式：