码迷,mamicode.com
首页 > Web开发 > 详细

异步上传文件、图片

时间:2017-04-04 23:06:35      阅读:233      评论:0      收藏:0      [点我收藏+]

标签:rom   substr   define   return   fine   尺寸   multipart   contents   move   

// 目标页面上有东西 <input type="file" name="fileField" id="fileField" />
function ajaxUpload(opt) {

    /*
    参数说明:
    opt.ID : 页面里file控件的ID;
    opt.Format : 文件格式,以数组的形式传递,如[‘jpg‘,‘png‘,‘gif‘,‘bmp‘];
    opt.CallBack : 上传成功后回调;
    opt.Url:上传地址;
    opt.ImageSizeArry:图片压缩尺寸,如[‘200x200‘,‘100x100‘];
    opt.ProxyUrl : 上传回调代理地址
    */
    var iName = "frameName" + Math.random().toString(); //太长了,变短点
    var iframe, form, file, fileParent;

    var postUrl = opt.Url;
    if (postUrl.indexOf("?") <= -1)
    {
        postUrl += "?rd=" + Math.random();
    }

    if (opt.ImageSizeArry != null && opt.ImageSizeArry != undefined && opt.ImageSizeArry != "") {
        postUrl += "&ImageSizeArry=" + opt.ImageSizeArry;
    }

    if (opt.ProxyUrl != null && opt.ProxyUrl != undefined && opt.ProxyUrl != "") {
        postUrl += "&proxyUrl=" + encodeURIComponent(opt.ProxyUrl);
    }

    //创建iframe和form表单
    iframe = $(‘<iframe name="‘ + iName + ‘" style="display:none;"  />‘);
    form = $(‘<form method="post" target="‘ + iName + ‘" style="display:none;" action="‘ + postUrl + ‘"  name="form_‘ + iName + ‘" enctype="multipart/form-data" ></from>‘);
    file = $(‘#‘ + opt.ID); //通过ID获取flie控件
    fileParent = file.parent(); //存父级

    if (file.val()=="") {
        return;
    }

    file.appendTo(form);
    //插入body
    $(document.body).append(iframe).append(form);

    //取得所选文件的扩展名
    var fileFormat = /\.[a-zA-Z]+$/.exec(file.val())[0].substring(1);
    if (opt.Format.join(‘-‘).indexOf(fileFormat) != -1) {
        form.submit(); //格式通过验证后提交表单;

    } else {
        file.appendTo(fileParent); //将file控件放回到页面
        iframe.remove();
        form.remove();
        $.DR_Alter("文件格式错误,请重新选择!");
    };

    //文件提交完后
    iframe.load(function () {
        var data = $(iframe).contents().find(‘body‘).html();
        file.appendTo(fileParent);
        iframe.remove();
        form.remove();
        opt.CallBack(data, opt.ID);
    })


}

  

异步上传文件、图片

标签:rom   substr   define   return   fine   尺寸   multipart   contents   move   

原文地址:http://www.cnblogs.com/ITanyx/p/6666684.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!