ajax上传时参数提交不更新等相关问题


Posted in Javascript onDecember 11, 2012

先前,我从网上下载了一个jQuery的Ajax上传插件,网页的左侧是上传分类,想要实现的一个功能是如此这样的:我本来是打算在服务端根据上传分类建立不同的文件夹来保存文件的,因此这个就需要传一个上传分类参数给后台。这些上传分类是从数据库读出,用repeater生成的。当点击其中一个分类时就给他设置一个样式,并且将这个分类的名字保存到一个变量uploadCatlog中。我可以取到分类并传给后台,但是很奇怪的是只有第一次是正确的,以后的每次参数都不更新。其实在上传插件的onComplete回调函数中也用到了uploadCatlog,它的值也已经更新了。我感觉好像这个上传插件只在第一次点击的时候实例化并将参数传给后台,所以以后值都是不变的,应该怎么解决这个问题呢?下面是我的js代码细节:
JavaScript code:

<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>

后来找到了一个解决方案,那就是:创建实例后就不会变了,可以在onSubmit回调函数中调用SetData方法设置动态参数,如下的代码及注释详情:
JavaScript code:
//可以使用这些方法来配置AJAX的上传
var upload = new AjaxUpload(‘#div_id',{action: ‘upload.php'});
//例如当用户选择了一些东西,设置一些参数
upload.setData({ ”catlog”:
ajax的上传参数提交,总是会因为各种各样的错误而出现问题,但是如何来解决问题,怎样使用最好的方法来解决问题,是个值得深究的难题,要想很好的解决编程过程中出现的问题,还是需要自己不断的钻研和学习!
Javascript 相关文章推荐
JavaScript匿名函数用法分析
Feb 13 Javascript
javascript实现淡蓝色的鼠标拖动选择框实例
May 09 Javascript
javascript实现可全选、反选及删除表格的方法
May 15 Javascript
js读取并解析JSON类型数据的方法
Nov 14 Javascript
分享两款带遮罩的jQuery弹出框
Dec 30 Javascript
jQuery Ajax使用FormData上传文件和其他数据后端web.py获取
Jun 11 jQuery
详解Angular之constructor和ngOnInit差异及适用场景
Jun 22 Javascript
AngularJS实现表格的增删改查(仅限前端)
Jul 04 Javascript
详解cordova打包成webapp的方法
Oct 18 Javascript
webpack4.x开发环境配置详解
Aug 04 Javascript
js实现浏览器打印功能的示例代码
Jul 15 Javascript
JS实现炫酷雪花飘落效果
Aug 19 Javascript
jQuery(非HTML5)可编辑表格实现代码
Dec 11 #Javascript
jQuery使用数组编写图片无缝向左滚动
Dec 11 #Javascript
如何获取JQUERY AJAX返回的JSON结果集实现代码
Dec 10 #Javascript
ajax不执行success回调而是执行了error回调
Dec 10 #Javascript
解决js正则匹配换行问题实现代码
Dec 10 #Javascript
解决jquery异步按一定的时间间隔刷新问题
Dec 10 #Javascript
怎样在JavaScript里写一个swing把数据插入数据库
Dec 10 #Javascript
You might like
Windows下PHP的任意文件执行漏洞
2006/10/09 PHP
PHP调用存储过程返回值不一致问题的解决方法分析
2016/04/26 PHP
javascript json2 使用方法
2010/03/16 Javascript
jcarousellite.js 基于Jquery的图片无缝滚动插件
2010/12/30 Javascript
JavaScript操纵窗口的方法小结
2013/06/28 Javascript
node.js从数据库获取数据
2016/05/08 Javascript
JavaScript中三种常见的排序方法
2017/02/24 Javascript
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
2017/04/14 jQuery
浅谈React高阶组件
2018/03/28 Javascript
微信小程序实现复选框效果
2018/12/28 Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
2019/02/02 Javascript
微信小程序入门之指南针
2020/10/22 Javascript
[01:32]DOTA2上海特锦赛现场采访:最想COS的英雄
2016/03/25 DOTA
Python中集合的内建函数和内建方法学习教程
2015/08/19 Python
Python读大数据txt
2016/03/28 Python
Python获取暗黑破坏神3战网前1000命位玩家的英雄技能统计
2016/07/04 Python
Python处理文本文件中控制字符的方法
2017/02/07 Python
Python 内置函数memoryview(obj)的具体用法
2017/11/23 Python
Python基于FTP模块实现ftp文件上传操作示例
2018/04/23 Python
python破解zip加密文件的方法
2018/05/31 Python
Python通过调用有道翻译api实现翻译功能示例
2018/07/19 Python
详解Python logging调用Logger.info方法的处理过程
2019/02/12 Python
详解python中index()、find()方法
2019/08/29 Python
Python 实现Serial 与STM32J进行串口通讯
2019/12/18 Python
PyTorch中的拷贝与就地操作详解
2020/12/09 Python
如何用Python来进行查询和替换一个文本字符串
2014/01/02 面试题
医药工作者的求职信范文
2013/09/21 职场文书
高中地理教学反思
2014/01/29 职场文书
新学期国旗下演讲稿
2014/05/08 职场文书
体育节口号
2014/06/19 职场文书
大学生心理活动总结
2014/07/04 职场文书
大学生暑期社会实践证明范本
2014/10/24 职场文书
挂职个人工作总结
2015/03/05 职场文书
2015年施工员工作总结范文
2015/04/20 职场文书
2015年大学教师工作总结
2015/05/20 职场文书
导游词之河北野三坡
2019/12/11 职场文书