ajaxFileUpload上传文件时，自定义参数data后台获取为null的问题_教程

ajaxFileUpload自定义参数，后台获取的时候为null

解决办法：修改ajaxFileUpload.js文件中createUploadForm()函数，新增传入参数data，并创建hidden控件，存储自定义参数

createUploadForm: function (id, fileElementId, data) {

....

if (data) {

}

找到ajaxFileUpload.js文件中调用createUploadForm()函数的地方,传入产生即可

ajaxFileUpload: function (s) {

...

var form = jQuery.createUploadForm(id, s.fileElementId,s.data)

...

}

用到两个对象

第一个对象：FormData

第二个对象：XMLHttpRequest

目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象，但IE9尚未支持 FormData 对象，还在用IE6 ? 只能仰天长叹....

有了这两个对象，我们可以真正的实现Ajax方式上传文件。

示例代码：

<!DOCTYPE html>

<html>

<head>

function UpladFile() {

var fileObj = document.getElementByIdx_x_x("file").files[0]// 获取文件对象

var FileController = "../file/save" // 接收上传文件的后台地址

// FormData 对象

var form = new FormData()

form.append("author", "hooyes") // 可以增加表单数据

form.append("file", fileObj) // 文件对象

// XMLHttpRequest 对象

var xhr = new XMLHttpRequest()

xhr.open("post", FileController, true)

xhr.onload = function () {

alert("上传完成!")

}

xhr.send(form)

}

</script>

</head>

<body>

</body>

</html>

很简洁的代码，便可以达到Ajax方式上传文件，上面的代码中使用<input type="file" />这种传统的选择文件的方法产生文件对象，HTML5还支持使用多种更灵活的方式，如拖拽文件到指定的元素上产生。

欢迎分享，转载请注明来源：内存溢出

ajaxFileUpload上传文件时，自定义参数data后台获取为null的问题