同事 一次需要ajax 上传某文件, 正好以前用过一种,叫ajaxupload,是jquery的一个插件. 于是几分钟帮同事搞定.代码如下:
var button = $('#upload_button'); //定义能够上传文件的按钮,就是一个普通的button
var fileType = "zip",fileNum = "one"; //定义能够上传的文件类型,当然要靠后面的onSubmit中的js去做判断
new AjaxUpload(button,{
action: '${ctp}/app/assistVerify/importShanghairReportAction.shtml',
name: 'shanghaiFile', //这相当于<input type = "file" name = "shanghaiFile"/>
onSubmit : function(file, ext){
if(fileType == "zip")
{
if (ext && /^(zip|rar)$/.test(ext)){
this.setData({
'info': '文件类型为压缩包' //这个info 暂时无效
});
} else {
alert('非压缩包类型文件,请重传');
return false;
}
}
button.text('导入上海资信中...');
if(fileNum == 'one') //同时上传的文件数不能超过一个
this.disable();
},
onComplete: function(file, response){ //上传完毕后的操作
if(response != "success")
alert(response);
button.text('导入上海资信');
this.enable();
if(response == "success");
alert("导入上海资信成功");
//有了response我们能做任何事了,返回的文件名称,文件路径等我们可以随意操作的!
}
});
当然这些代码得靠 js 才能运行,请把上面的代码加在 $(document).ready的代码块中.同时请引入 ajaxupload.js,见附件下载!
分享到:
相关推荐
ajaxupload.js 是一款使用jquery上传文件的js插件,对于简单的文件上传,足够可以应付, 你可以根据自身需要对前后端代码进行补充,也可以将一些...总的来说Jquery插件AjaxUpload实现文件上传功能的应用还是比较容易的。
**jQuery AjaxUpload应用详解** AjaxUpload是一款非常实用的JavaScript插件,它允许用户在无需刷新页面的情况下上传文件,极大地提升了用户体验。在这个详细的知识点解析中,我们将深入理解AjaxUpload的工作原理,...
在IT行业中,前端开发经常需要处理用户上传图片的需求,而"jQuery+ajaxupload+imgareaselect+asp.net上传预览截取图像"这个主题,就是一种高效且用户体验优秀的解决方案。接下来,我们将深入探讨这些技术及其整合...
在给定的压缩包文件`jQuery-File-Upload-master`中,包含了一个强大的jQuery插件——jQuery File Upload。这个插件提供了更丰富的功能,如多文件上传、文件预览、拖放支持、进度条等。使用该插件,可以极大地简化...
AjaxUpload是jQuery的一个插件,它提供了一种方便的异步文件上传方式,无需刷新页面即可完成文件上传,提高了用户体验。在这个“Jquery AjaxUpload实现文件上传实例 PHP版”中,我们将探讨如何使用jQuery的Ajax...
总结来说,`jQuery ajax file upload`是通过`ajaxFileUpload`插件实现的一种无刷新的文件上传方式,它提高了用户体验,并且提供了丰富的自定义选项和回调机制,适用于各种Web应用的文件上传需求。要正确使用,需要...
jQuery插件ajaxupload是用于实现文件上传功能的一个工具,它可以在客户端通过JavaScript异步地上传文件到服务器。在本文中,将详细介绍如何利用ajaxupload插件实现文件上传操作,并提供相应的代码示例和截图说明,...
标题"ajaxUpload."和描述"ajaxUpload.ajaxUpload.ajaxUpload."暗示我们将深入探讨这个话题。 ### 一、Ajax Upload原理 Ajax Upload的核心是利用JavaScript的异步特性,通过XMLHttpRequest对象与服务器进行通信。它...
浏览器迫使我们使用文件输入控件(<input type=”file” />)做上传,然而此控件的样式是不能修改...Ajax Upload文件上传插件不会污染任何命名空间,所以它与jQuery,Prototypejs,mootools其他JavaScript库兼容。
本教程将探讨几个jQuery的精彩应用实例,包括菜单设计、文件上传、树形结构、表单验证以及滑动效果,帮助你深入理解并熟练运用jQuery。** ### 1. 菜单设计 创建动态交互式菜单是jQuery的一大强项。利用`click`事件...
jQuery File Upload是一款功能强大的文件上传插件,专为前端开发者设计,用于在Web应用程序中实现高效、用户友好的多文件上传功能。这个插件的版本是v10.32.0,它提供了丰富的特性,使得文件上传变得更加简单且可控...
在本例中,我们将使用一个jQuery插件,如`AjaxUpload`或者`jQuery Form Plugin`来处理文件上传。这些插件提供了友好的API,使我们能够方便地构建无刷新上传功能。 下面是一个基本的使用步骤: 1. **HTML结构**:...
综上所述,AjaxUpload是现代Web应用中实现高效、流畅文件上传的一种重要技术,结合JavaScript和Ajax,它能提供更好的用户体验。不过,随着技术的发展,HTML5的File API和Fetch API等新特性也在逐步替代传统的Ajax...
jQuery File Upload是一款强大的基于jQuery的文件上传插件,它提供了多文件选择、进度条显示、预览、上传取消以及删除等功能。这款插件利用HTML5技术,为现代浏览器提供了先进的文件上传体验,同时通过优雅降级的...
jQuery插件是jQuery框架的扩展,它们提供额外的功能和方便的API,使得开发人员能够快速地构建功能丰富的Web应用。在Ajax无刷上传场景中,这类插件通常会包含一套完整的解决方案,包括前端的交互逻辑、错误处理以及与...
2. **jQuery插件编写**:jQuery插件通常以函数形式存在,可以通过$.fn扩展jQuery对象。一个简单的进度条插件可能会包含初始化、开始、更新和结束等方法。以下是一个基本示例: ```javascript (function($) { $.fn....
《基于jQuery的文件上传插件JQuery.upload详解》 在Web开发中,文件上传功能是不可或缺的一部分,尤其在用户交互丰富的现代网站上。jQuery作为一款轻量级、高性能的JavaScript库,提供了许多便利的API来简化DOM操作...
总之,jQuery File Upload 9.5.0作为一款成熟的上传插件,具备完善的上传功能和强大的定制能力,是构建现代Web应用不可或缺的工具。它通过jQuery和JavaScript的强大组合,为开发者提供了优雅的文件上传解决方案,...