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 动态加载脚本和样式的方法
Apr 13 Javascript
JS实现按钮颜色切换效果
Sep 05 Javascript
深入理解JavaScript 中的匿名函数((function() {})();)与变量的作用域
Aug 28 Javascript
前端防止用户重复提交js实现代码示例
Sep 07 Javascript
实例讲解JS中pop使用方法
Jan 27 Javascript
解决element ui select下拉框不回显数据问题的解决
Feb 20 Javascript
vue filter 完美时间日期格式的代码
Aug 14 Javascript
Vue的transition-group与Virtual Dom Diff算法的使用
Dec 09 Javascript
js实现计时器秒表功能
Dec 16 Javascript
Javascript Web Worker使用过程解析
Mar 16 Javascript
多种类型jQuery网页验证码插件代码实例
Jan 09 jQuery
vue组件冲突之引用另一个组件出现组件不显示的问题
Apr 13 Vue.js
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+Ajax实时自动检测是否联网的方法
2015/07/01 PHP
php基于PDO连接MSSQL示例DEMO
2016/07/13 PHP
jQuery maxlength文本字数限制插件
2010/04/16 Javascript
文本框中,回车键触发事件的js代码[多浏览器兼容]
2010/06/07 Javascript
jQuery源码分析-03构造jQuery对象-源码结构和核心函数
2011/11/14 Javascript
NodeJS Express框架中处理404页面一个方式
2014/05/28 NodeJs
javascript实现瀑布流加载图片原理
2016/02/02 Javascript
利用Node.js编写跨平台的spawn语句详解
2017/02/12 Javascript
深入理解AngularJS中的ng-bind-html指令
2017/03/27 Javascript
Bootstrap.css与layDate日期选择样式起冲突的解决办法
2017/04/07 Javascript
深入理解Angular中的依赖注入
2017/06/26 Javascript
React如何将组件渲染到指定DOM节点详解
2017/09/08 Javascript
如何用RxJS实现Redux Form
2018/12/29 Javascript
javascript实现自由编辑图片代码详解
2019/06/21 Javascript
js实现查询商品案例
2020/07/22 Javascript
django 发送手机验证码的示例代码
2018/04/25 Python
python人民币小写转大写辅助工具
2018/06/20 Python
详解重置Django migration的常见方式
2019/02/15 Python
Python学习笔记之视频人脸检测识别实例教程
2019/03/06 Python
Django 导出项目依赖库到 requirements.txt过程解析
2019/08/23 Python
Python发送邮件的实例代码讲解
2019/10/16 Python
python随机生成大小写字母数字混合密码(仅20行代码)
2020/02/01 Python
PyCharm中如何直接使用Anaconda已安装的库
2020/05/28 Python
浅析python中的del用法
2020/09/02 Python
CSS3圆角和渐变2种常用功能详解
2016/01/06 HTML / CSS
多视角3D可旋转的HTML5 Logo动画
2016/03/02 HTML / CSS
《与象共舞》教学反思
2014/02/24 职场文书
祖国在我心中演讲稿600字
2014/05/04 职场文书
2014业务员年终工作总结
2014/12/09 职场文书
委托函范文
2015/01/29 职场文书
自荐信格式范文
2015/03/04 职场文书
2016北大自主招生自荐信模板
2016/01/28 职场文书
2016年第二十五次全国助残日活动总结
2016/04/01 职场文书
2019年新郎保证书3篇
2019/10/17 职场文书
初中运动会闭幕词范本3篇
2019/12/09 职场文书
MySQL8.0 Undo Tablespace管理详解
2022/06/16 MySQL