• Ajaxupload.js上传插件使用


    注意一下火狐,360IE78下的坑:

    返回过来的response在不同浏览器下的字符串不一致

    // response(chrome):<pre style="word-wrap: break-word; white-space: pre-wrap;">{"success":true,"info":"保存成功!","PhotoURL":"/upload_BenefitsFund/33/20151204102733907401WRME4.png"}</pre>

    // response(360IE78):<PRE>{"success":true,"info":"保存成功!","PhotoURL":"/upload_BenefitsFund/33/20151204101939484PTND5ELI.png"}</PRE>

    // response(Firefox):"<pre>{"success":true,"info":"保存成功!","PhotoURL":"/upload_BenefitsFund/33/20151204102931978J0GLUULI.png"}</pre>"

    单纯的正则匹配并移除多余部分已经不能满足不同浏览器下的需求了

    于是我们只能通过”{” ,”}”匹配截取”{”前面与”}”后面的

    最后把剩余部分的json格式字符串再通过eval转为json

    var UploadImg = function ($_selector, applyType, type) {
    
                var button = $($_selector), interval;
                new AjaxUpload(button, {
                    action: 'Handler/Users/BenefitsFund.ashx?action=ImgSave&applyType=' + applyType + '&type='+type,
                    name: 'myfile',
                   // dataType: "json",
                    onSubmit: function (file, ext) {
                        if (!(ext && /^(jpg|jpeg|png|gif|JPG|JPEG|PNG|GIF)$/.test(ext))) {
                           alert("图片格式不正确,请重新选择!");
                            return false;
                        }
                    },
                    onComplete: function (file, response) {//当上传完成时的操作
                       console.log(response);
                        // response(chrome):<pre style="word-wrap: break-word; white-space: pre-wrap;">{"success":true,"info":"保存成功!","PhotoURL":"/upload_BenefitsFund/33/20151204102733907401WRME4.png"}</pre>
                        // response(360IE78):<PRE>{"success":true,"info":"保存成功!","PhotoURL":"/upload_BenefitsFund/33/20151204101939484PTND5ELI.png"}</PRE>
                        // response(Firefox):"<pre>{"success":true,"info":"保存成功!","PhotoURL":"/upload_BenefitsFund/33/20151204102931978J0GLUULI.png"}</pre>"
                       response = response.substring(response.lastIndexOf("{"));///去response中"{"前面的除字符串
                       // console.log(response);
                       response = response.substring(0, response.lastIndexOf("}") + 1);///去response中"}"后面的除字符串
                        //alert(response);
                       // console.log(response);
                        //var reg = /<pre.+?>(.+)</pre>/g;
                        //var result = response.match(reg);
                        //response = RegExp.$1;//去除多余的字符串
    
                      //  alert(response)
                        //response = JSON.parse(response);//转成json格式 IE78不支持
                       // response = $.parseJSON(response);//转成json格式
                        response = eval("(" + response + ")");//转成json格式 IE78支持
    
                       // response = JSON.parse(response);
                        //alert(response)
                       // console.log(response);
                        //var _MyJson = '{ "success": true, "info": "保存成功!", "PhotoURL": "/upload_BenefitsFund/33/201512031628303370LTKBULS.png" }';
                        //alert(_MyJson);
                        //console.log("1" + _MyJson);
                        //_MyJson = eval("(" + _MyJson + ")");
                       
                       // alert(response.success)
                        if (response.success == true) {
                            alert("上传成功");
                            button.find(".upload_img").attr("src", response.PhotoURL)
                        }
                        else {
                            alert(response.reason);
                        }
                        //if (file!= "") {
                        //    //window.location.href = window.location.href;
                        //    alert("dd");
                        //    //alert(response)
                        //    console.log(response)
                        //}
                    },
                    onError: function (id, fName, error) {
                        ZENG.msgbox.show("上传失败,请重试!", 1, 2000);
                        window.clearInterval(interval);
    
                    }
                });
            }
            new UploadImg(".Js_upload_sfz01",4,0);//上传身份证正面
  • 相关阅读:
    转载:C#中的属性、和字段的区别
    在idea中创建一个maven web工程及解决工程创建过慢问题
    注解&动态代理
    Listener&Filter
    Ajax&jQuery
    JSP&EL&JSTL
    Cookie&Session
    HttpServletRequest&HttpServletResponse
    Http协议&Servlet
    XML
  • 原文地址:https://www.cnblogs.com/ruoqiang/p/5018873.html
Copyright © 2020-2023  润新知