在执行异步文件上传后返回的json 火狐没问题ie提示下载

junjichu 发布于 2015/01/07 17:48
阅读 1K+
收藏 0

@JFinal 你好,想跟你请教个问题:在执行异步文件上传后返回的json 火狐没问题,ie提示下载

JFinal +freemarker

上代码

@Before(POST.class)
	public void chgHeader() {
		//开始处理图片
		UploadFile uploadFile = getFile();
		//if(!ImageResizer.checkIsImage(uploadFile.getFile())){//该方法可以忽略
			
			setAttr("result", "error");
			setAttr("error", "文件格式不正确");
			renderJson();
//			return;
		//}
	}


js代码,html代码。引入jquery.upload.js(最下面已贴出)

$(function() {
$("#file-upload").upload({
        action: "${ctx!}/user/chgHeader", 
        fileName: "file",    
        params: {},
        accept: ".jpg,.png,.jpeg,.gif",  
        dataType: 'JSON',
        success: function (data) {
}
}


<form id="fileinput" action="${ctx!}/user/chgHeader" method="post" enctype="multipart/form-data">
<div >
	
	<div >
		<input type="file" id="file-upload" name="files" />
	</div>

</div>
</form>

下面是jquery.upload.js 直接引入

/**
 */
$.fn.upload = function (options) {
    options = options || {};
    options.dom = this;
    $.upload(options);
}
$.upload = function (options) {
    var settings = {
        dom: "",
        action: "",
        fileName: "file",
        params: {},
        accept: ".jpg,.png",
        ieSubmitBtnText: "上传",
		dataType:"text",
        complete: function (result) {
			alert(result);
        },
        submit: function () {

        }
    }
    settings = $.extend(settings, options);
    var ele = settings.dom;

    var iframeName = "leunpha_iframe_v" + Math.random() * 100;
    var width = ele.outerWidth();
    var height = ele.outerHeight();
    var iframe = $("<iframe name='"+iframeName+"' style='display:none;' id='"+iframeName+"'></iframe>");
    var form = $("<form></form>");
    form.attr({
        target: iframeName,
        action: settings.action,
        method: "post",
        "class": "ajax_form",
        enctype: "multipart/form-data"
    }).css({
            width: width,
            height: height,
            position: "absolute",
            top: (ele.offset().top),
            left: (ele.offset().left)
        });
    var input = $("<input type='file'/>");
    input.attr({
        accept: settings.accept,
        name: settings.fileName
    })
        .css({
            opacity: 0,
            position: "absolute",
            width: width,
            height: height + "px",
            cursor: "pointer"
        });
    input.change(function () {
        settings.submit.call(form);
        $(this).parent("form").submit();
    });
    form.append(input);
    $("body").append(iframe);
    iframe.after(form);
    for (var param in settings.params) {
        var div = $("<input type='hidden'/>").attr({name: param, value: settings.params[param]});
        input.after(div)
        div = null;
        delete div;
    }
    iframe.load(function () {
        var im = document.getElementById(iframeName);
        var text = $(im.contentWindow.document.body).text();
		if(text){
			var dataType = settings.dataType.toLocaleUpperCase();
			if( dataType == "JSON"){
				try{
					if(typeof text=="string")
						text = $.parseJSON(text);
				}catch(e){
					text = "error";
				}
			}else if(dataType == "xml"){
				//字符串转xml 需开发者个人手动转换
			}else{
				//默认就是text
			}
		}
		settings.complete.call(null, text);
    });
}







加载中
0
JFinal
JFinal

IE 不遵守 json 规范,所以无法识别 context type 值: application/json,所以需要这样:

render(new JsonRender(paras).forIE());

这个在 JFinal 手册中有红色字体说明文字,再仔细看一下 jfinal 手册中的方案

0
牵牛哥
牵牛哥

试了各种方法,改contentType,JS添加兼容性处理,等等都不行,根据波波哥的提示,我的问题就解决了

OSCHINA
登录后可查看更多优质内容
返回顶部
顶部