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 相关文章推荐
一个JS翻页效果
Jul 23 Javascript
jquery 实现的全选和反选
Apr 15 Javascript
js正文内容高亮效果的实现方法
Jun 30 Javascript
js去除空格的12种实用方法
Nov 08 Javascript
JavaScript中的数学运算介绍
Dec 29 Javascript
js获取微信版本号的方法
May 12 Javascript
JS定时器用法分析【时钟与菜单中的应用】
Dec 21 Javascript
利用JS制作万年历的方法
Aug 16 Javascript
一个有意思的鼠标点击文字特效jquery代码
Sep 23 jQuery
H5实现仿flash效果的实现代码
Sep 29 Javascript
浅析Vue.js 中的条件渲染指令
Nov 19 Javascript
解决vue请求接口第一次成功,第二次失败问题
Sep 08 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
php递归实现无限分类生成下拉列表的函数
2010/08/08 PHP
ThinkPHP3.1新特性之G方法的使用
2014/06/19 PHP
php使用mysqli向数据库添加数据的方法
2015/03/20 PHP
php array_key_exists() 与 isset() 的区别
2016/10/24 PHP
PHP工厂模式简单实现方法示例
2018/05/23 PHP
解决laravel上传图片之后,目录有图片,但是访问不到(404)的问题
2019/10/14 PHP
非常好的js代码
2006/06/27 Javascript
jquery中加载图片自适应大小主要实现代码
2013/08/23 Javascript
JS获得QQ号码的昵称,头像,生日的简单实例
2013/12/04 Javascript
js图片处理示例代码
2014/05/12 Javascript
javascript 闭包详解
2015/02/15 Javascript
jquery实现鼠标经过显示下划线的渐变下拉菜单效果代码
2015/08/24 Javascript
jQuery UI Bootstrap是什么?
2016/06/17 Javascript
Vue.js实现模拟微信朋友圈开发demo
2017/04/20 Javascript
requirejs按需加载angularjs文件实例
2017/06/08 Javascript
JavaScript实现删除数组重复元素的5种常用高效算法总结
2018/01/18 Javascript
[原创]jQuery实现合并/追加数组并去除重复项的方法
2018/04/11 jQuery
微信小程序自定义菜单切换栏tabbar组件代码实例
2019/12/30 Javascript
Vant picker 多级联动操作
2020/11/02 Javascript
JavaScript中常用的3种弹出提示框(alert、confirm、prompt)
2020/11/10 Javascript
理解python多线程(python多线程简明教程)
2014/06/09 Python
Python中operator模块的操作符使用示例总结
2016/06/28 Python
python模拟登录并且保持cookie的方法详解
2017/04/04 Python
Python如何处理大数据?3个技巧效率提升攻略(推荐)
2019/04/15 Python
Python大数据之从网页上爬取数据的方法详解
2019/11/16 Python
如何在Windows中安装多个python解释器
2020/06/16 Python
tensorflow 动态获取 BatchSzie 的大小实例
2020/06/30 Python
python list等分并从等分的子集中随机选取一个数
2020/11/16 Python
利用python进行文件操作
2020/12/04 Python
HTML5 Canvas旋转动画的2个代码例子(一个旋转的太极图效果)
2014/04/10 HTML / CSS
英国泰坦旅游网站:全球陪同游览,邮轮和铁路旅行
2016/11/29 全球购物
写给父母的感谢信
2015/01/22 职场文书
企业百日安全活动总结
2015/05/07 职场文书
幽默口才训练经典句子(48句)
2019/08/19 职场文书
如何设置多台电脑共享打印机?多台电脑共享打印机的方法
2022/04/08 数码科技
win11自动弹出虚拟键盘怎么关闭? Win11关闭虚拟键盘的技巧
2023/01/09 数码科技