在使用jQuery AjaxUpload插件进行文件上传时，常遇到动态参数（如上传分类）仅在首次提交有效、后续请求参数不变的问题。这是因为插件实例化时绑定了初始参数值。本文通过分析代码指出，应在onSubmit回调中调用setData方法动态设置参数，以确保每次上传都能传递最新的分类信息。
AjaxUpload动态参数不更新问题描述
此前，我从网络获取了一个基于jQuery的文件上传插件。页面左侧展示了上传分类列表，我的需求是：服务端需根据上传的分类建立不同文件夹以存储文件，因此必须向后台传递一个“上传分类”参数。这些分类数据从数据库读取，并通过Repeater控件生成。当用户点击某个分类时，系统会为该分类添加特定样式，并将该分类名称保存至变量uploadCatlog中。虽然我能获取分类名称并尝试传给后台，但出现了一个奇怪现象：只有第一次上传时参数正确，后续所有请求的参数值均不更新。实际上，在上传插件的onComplete回调函数中，uploadCatlog的值确实已经更新。我推测该上传插件仅在首次点击时进行实例化，并将参数传递给后台，导致后续值保持不变。针对此问题，应如何解决？以下是我的JavaScript代码细节：
JavaScript代码示例如下：
具体代码如下：
<script type="text/javascript">
$(function () {
var uploadCatlog;
//设置母版页导航栏的当前选中样式
$("#menu .nav5").addClass("menu_active").siblings().removeClass("menu_active");
//生成类别菜单样式和导航菜单
$("#kllst li").click(function () {
$(this).addClass("currentli").siblings().removeClass();
uploadCatlog = $(this).text();
});
var btnUpload = $('#upload');
var status = $('#status');
btnUpload.click(function () {
if (uploadCatlog == undefined) {
status.text("必须先选择上传文件的类别！").addClass('error');
return false;
}
new AjaxUpload(btnUpload, {
action: 'handler/doUpload.ashx',
name: 'uploadfile',
onSubmit: function (file, ext) {
if (!(ext && /^(doc|docx|xls)$/.test(ext))) {
status.text('只支持WORD,EXCEL格式上传！').addClass('error');
return false;
}
status.text('正在上传，请稍候...');
},
data: { "catlog": uploadCatlog },
onComplete: function (file, response) {
status.text('').removeClass('error');
if (response == "success") {
var fimgtype;
if (file.indexOf(".doc") != -1 || file.indexOf(".docx") != -1) {
fimgtype = "word";
}
if (file.indexOf(".xls") != -1) {
fimgtype = "excel";
}
$('<li></li>').appendTo('#files').html('<img src="images/' + fimgtype + '.png" alt="" /><br />[' + uploadCatlog + ']' + file).addClass('success');
} else {
$('<li></li>').appendTo('#files').text(file).addClass('error');
}
}
});
});
});
</script>通过setData方法解决动态参数提交
后来我找到了一个解决方案：插件实例一旦创建，其初始参数便不再变化。正确的做法是在onSubmit回调函数中调用SetData方法来设置动态参数。具体代码及注释详情如下：
JavaScript代码示例：
//可以使用这些方法来配置AJAX的上传
var upload = new AjaxUpload(‘#div_id',{action: ‘upload.php'});
//例如当用户选择了一些东西，设置一些参数
upload.setData({ ”catlog":
Ajax上传功能的参数提交常因各种错误导致问题，但如何有效解决并采用最佳方案，是一个值得深入研究的课题。要很好地解决编程过程中出现的此类问题，仍需依靠不断的钻研和学习！