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得到XML某节点的子节点个数的脚本
Oct 11 Javascript
jQuery实现仿QQ在线客服效果的滚动层代码
Oct 15 Javascript
javascript特殊日历控件分享
Mar 07 Javascript
jQuery自定义图片缩放拖拽插件imageQ实现方法(附demo源码下载)
May 27 Javascript
BootStrap入门教程(二)之固定的内置样式
Sep 19 Javascript
JavaScript九九乘法口诀表的简单实现
Oct 04 Javascript
微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义实例
Dec 08 Javascript
javascript replace()第二个参数为函数时的参数用法
Dec 26 Javascript
理解javascript中的闭包
Jan 11 Javascript
vue中使用better-scroll实现滑动效果及注意事项
Nov 15 Javascript
JavaScript冒泡算法原理与实现方法深入理解
Jun 04 Javascript
原生js实现自定义消息提示框
Nov 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
笑谈配置,使用Smarty技术
2007/01/04 PHP
PHP return语句的另一个作用
2014/07/30 PHP
ThinkPHP框架实现数据增删改
2017/05/07 PHP
location.href语句与火狐不兼容的问题
2010/07/04 Javascript
基于JQuery的数字改变的动画效果--可用来做计数器
2010/08/11 Javascript
javascript自定义右键弹出菜单实现方法
2015/05/25 Javascript
JavaScript中数据结构与算法(一):栈
2015/06/19 Javascript
Bootstrap每天必学之js插件
2015/11/30 Javascript
WebSocket+node.js创建即时通信的Web聊天服务器
2016/08/08 Javascript
JS设置随机出现2个数字的实例代码
2017/07/19 Javascript
Vue-cli-webpack搭建斗鱼直播步骤详解
2017/11/17 Javascript
vue移动UI框架滑动加载数据的方法
2018/03/12 Javascript
详解基于mpvue的小程序markdown适配解决方案
2018/05/08 Javascript
Vue如何基于es6导入外部js文件
2020/05/15 Javascript
vue实现简易图片左右旋转,上一张,下一张组件案例
2020/07/31 Javascript
[01:11]辉夜杯战队访谈宣传片—CDEC.Y
2015/12/26 DOTA
Python中字典和JSON互转操作实例
2015/01/19 Python
在Mac OS上搭建Python的开发环境
2015/12/24 Python
Python SQLite3数据库日期与时间常见函数用法分析
2017/08/14 Python
Vue的el-scrollbar实现自定义滚动
2018/05/29 Python
python实现的MySQL增删改查操作实例小结
2018/12/19 Python
twilio python自动拨打电话,播放自定义mp3音频的方法
2019/08/08 Python
python将dict中的unicode打印成中文实例
2020/05/11 Python
pycharm设置默认的UTF-8编码模式的方法详解
2020/06/01 Python
Python GUI之tkinter窗口视窗教程大集合(推荐)
2020/10/20 Python
Pytorch 中的optimizer使用说明
2021/03/03 Python
专门出售各种儿童读物的网站:Put Me In The Story
2016/08/07 全球购物
APM Monaco中国官网:来自摩纳哥珠宝品牌
2017/12/27 全球购物
英国内衣连锁店:Boux Avenue
2018/01/24 全球购物
Dr. Martens马汀博士澳大利亚官网:马丁靴鼻祖
2019/07/02 全球购物
Oasis服装官网:时尚女装在线
2020/07/09 全球购物
县委务虚会发言材料
2014/10/20 职场文书
党员违纪检讨书怎么写
2014/11/01 职场文书
租车协议书范本2014
2014/11/17 职场文书
仓库统计员岗位职责
2015/04/14 职场文书
Python内置数据类型中的集合详解
2022/03/18 Python