plupload自动上传,第二次提交无效。

发布于 2022-09-02 19:29:50 字数 2754 浏览 17 评论 0

1.使用plupload上传单个图片,上传后在页面显示缩略图;
2.使用的是自动上传,点击按钮选择图片后自动开始上传;
3.当第一次上传图片后,图片传错了,点击按钮再次上传,调用start方法后,没有向后台发送上传数据,延迟一段时间后,后台才接收到数据;

html部分代码:
<div class="form-group">

                                    <label class="col-sm-2 control-label" for="logopath"> 广告主LOGO: </label>
                                    <div class="col-sm-2" id ="uploadLogoDiv">
                                        <button id="uploadLogo" type="button" class="btn btn-primary btn-block">选择并上传</button> 
                                    </div>
                                    <input id="hiddenImage" hidden="hidden" name="user.logopath" value="${user.logopath!}"/>
                                    <span id="emsg" style="color: red;"></span>
                                    <img id="showImage" alt="" src="${user.logopath!}">
                                </div>
                                

js部分代码:

var initplupload = function() {

    //1.logo上传
    logoUpload = new plupload.Uploader({
            browse_button : 'uploadLogo',
            url : '${cxt!}/xxx/xxx/uploadLogo',
            flash_swf_url : '${cxt!}${tpath!}/js/plugin/plupload/Moxie.swf',
            silverlight_xap_url : '${cxt!}${tpath!}/js/plugin/plupload/Moxie.xap',
            filters : {
                mime_types : [ {
                    title : "image files",
                    extensions : "jpg,gif,png"
                }],
                max_file_size : '150kb'
            },
            multi_selection : false
    });
    //初始化
    logoUpload.init();
    
    //文件选择后上传
    logoUpload.bind('FilesAdded', autoupload);
    
  //上传完成填充数据
    logoUpload.bind('FileUploaded',
                function(uploader, file, responseObject) {
                    debugger;
                    $.each(file, function(idx, item){
                        uploader.removeFile(item);
                    });
                    var logopath=responseObject.response;
                    var data = $.parseJSON(logopath);
                    if(data.msg=="error"){
                        $("#emsg").html("尺寸错误");
                        $("#hiddenImage").val("");
                        $("#showImage").attr("src","");
                        return;
                    }
                    $("#emsg").html("");
                    $("#hiddenImage").val(data.msg);
                    $("#showImage").attr("src",data.msg);
                    common_ajax.successF("成功","上传成功!");
                });
};
//自动上传
var autoupload = function(uploader, files) {
    debugger;
    common_ajax.successF("上传","上传开始!");
    uploader.start();
};

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文