jquery使用ajax方式上传附件

一)项目上需要，要用到jquery使用ajax方式上传附件的方式。

经查找，得到一个名为ajaxFileUpload的插件。

翻阅官方文档发现用法简单。

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/ajaxfileupload.js"></script>

$.ajaxFileUpload({
	url: "teamwork/newTaskAttachmentUpload",
	secureuri: false,
	fileElementId: "attachment",
	dataType: "json",
	beforeSend: function() {
		
	},
	success: function(json) {
		alert(json.fileName);
	}
});

二)使用发现dataType设置成"json"时success指定的函数是不能响应的。

非常奇怪，经过Firebug调试得知，后端传来的json字符串被"<pre></pre>"包裹一下了。

如：{"name":"应卓","age":"30"}被包裹成了"<pre>{"name":"应卓","age":"30"}</pre>"

导致不能正确地生成json对象。

具体原因未知，有可能是这个插件与jquery1.7.2不兼容所致。

三)由于这个插件的源码不是gzip压缩版本，还有修改的可能。找出相对应的源码。

源码修改如下，可解决问题。

// ......

    uploadHttpData: function( r, type ) {
        var data = !type;
        data = type == "xml" || data ? r.responseXML : r.responseText;
        // If the type is "script", eval it in global context
        if ( type == "script" )
            jQuery.globalEval( data );
        // Get the JavaScript object, if JSON is used.
        if ( type == "json" ) {
        	// -------------------------------------------------------------
        	// 哥修改的地方，加了一条语句。
        	data = data.substring(5, data.indexOf("</pre>"));
        	// -------------------------------------------------------------
            eval( "data = " + data );
        }
        // evaluate scripts within html
        if ( type == "html" )
            jQuery("<div>").html(data).evalScripts();

        return data;
    }
})