jquery 实现ajax 上传文件的功能(使用插件 ajaxfileupload)
js文件的下载地址 : http://files.cnblogs.com/wangqc/ajaxfileupload.js
页面代码:
<html>
<!-- 引入相关的js文件,相对路径 -->
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/ajaxfileupload.js"></script>
<!-- 执行上传文件操作的函数 -->
<script type="text/javascript">
function ajaxFileUpload(id){
$.ajaxFileUpload(
{
url: 'About.aspx',
fileElementId: id,
dataType: 'json',
success: function (data, status) {
alert('添加成功');
},
error: function (data, status, e) {
alert('添加失败');
}
});
}
$(function() {
$("#btnSubmit").click(function () {
ajaxFileUpload("mytestfile");
});
});
</script>
</head>
同时 请注意 对应的file 控件一定要有name 属性,否则无论如何都不能进行此上传操作。
主要参数说明:
1,url表示处理文件上传操作的文件路径,可以测试URL是否能在浏览器中直接访问,如上:upload.php
2,fileElementId表示文件域ID,如上:fileToUpload
3,secureuri是否启用安全提交,默认为false
4,dataType数据数据,一般选json,javascript的原生态
5,success提交成功后处理函数
6,error提交失败处理函数
<body>
<form method="post" enctype="multipart/form-data">
<input type="file" value="我的文档" id="mytestfile" name="file1" />
<input type="button" value="上传" id="btnSubmit"/>
</form>
</body>
服务器代码可以参考本人的另外一篇,有详细的详解(前面extjs的部分可以不用看 ,直接跳过看后台的上传部分。 完全没有任何影响!) http://www.cnblogs.com/wangqc/p/extjsFileUpload.html
jquery 实现ajax 上传文件的功能(使用插件 ajaxfileupload)的更多相关文章
- IE8/9 JQuery.Ajax 上传文件无效
IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...
- jQuery ajax上传文件实例
jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...
- ajax上传文件 基于jquery form表单上传文件
<script src="/static/js/jquery.js"></script><script> $("#reg-btn&qu ...
- flask jQuery ajax 上传文件
1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > ...
- 闲话ajax,例ajax轮询,ajax上传文件[开发篇]
引语:ajax这门技术早已见怪不怪了,我本人也只是就自己真实的经验去总结一些不足道的话.供不是特别了解的朋友参考参考! 本来早就想写一篇关于ajax的文章的,但是前段时间一直很忙,就搁置了,趁着元旦放 ...
- ajax上传文件以及实现上传进度条(转载)
做微信企业号的时候,在‘我的日志'功能模块里边需要添加一个上传文件的功能,并且要显示上传过程中的进度条和提交后的文件名列表,于是做了基于ajax的文件上传,UI用的是MUI框架,后台是TP框架 前端代 ...
- atitit.ajax上传文件的实现原理 与设计
atitit.ajax上传文件的实现原理 与设计 1. 上传文件的三大难题 1 1.1. 本地预览 1 1.2. 无刷新 1 1.3. 进度显示 1 2. 传统的html4 + ajax 是无法直 ...
- 伪ajax上传文件
伪ajax上传文件 最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...
- django 基于form表单上传文件和基于ajax上传文件
一.基于form表单上传文件 1.html里是有一个input type="file" 和 ‘submit’的标签 2.vies.py def fileupload(request ...
随机推荐
- JVM内存配置
JVM内存主要分为两个部分,分别是PermanentSapce和HeapSpace. PermantSpace主要负责存放加载的Class类级对象如class本身,method,field等反射对象, ...
- Bootstrap 表格和按钮
一.表格 1.条纹状表格 行产生一行隔一行加单色背景效果 注:表格效果需要基于基本格式.table <table class="table table-striped"> ...
- 我的第一个chrome扩展(0)——目标
当前有两个方向: 一.实现一个自动解码的地址栏监视器 扩展程序在后台不断监视地址栏输入,地址栏输入并回车后检查输入,若输入符合解码条件则调用网站信息进行解码,并将结果输出到地址栏,否则不改变: 初始阶 ...
- 读书笔记——《图解TCP/IP》(3/4)
经典摘抄 第五章 IP协议相关技术 1.DNS可以将网址自动转换为具体的IP地址. 2.主机识别码的识别方式:为每台计算机赋以唯一的主机名,在进行网络通信时,可以直接使用主机名称而无需输入一大长串的I ...
- php---分组函数group_concat()
group_concat()函数总结 group_concat(),手册上说明:该函数返回带有来自一个组的连接的非NULL值的字符串结果.比较抽象,难以理解. 通俗点理解,其实是这样的:group_c ...
- [LeetCode] Divide Two Integers( bit + 二分法 )
Divide two integers without using multiplication, division and mod operator. 常常出现大的负数,无法用abs()转换成正数的 ...
- java构造函数,java的静态块理解
今天我遇到这样的代码块,理解甚久,现在理解了,举一些例题给你看看 先创建一个One类: package accp.com;/** * 其中一个类 * @author xuxiaohua * */pub ...
- 在RHEL5.2 64bit下编译安装log4cxx错误
apache-log4cxx.0.10.0 依赖于apache-apr和apache-apr-utils两个包 先安装他们俩,然后编译log4cxx,发现make失败,错误如下 ronized.o . ...
- java 中间件
先说中间件:非底层操作系统软件.非业务应用软件,不是直接给最终用户使用的,不能直接给客户带来价值的软件,统称中间件.常见的有如下几种:服务中间件.集成中间件.数据中间件.消息中间件.安全中间件. 其中 ...
- 让DIV中的内容水平和垂直居中
让一个层水平垂直居中是一个非常常见的布局方式,但在html中水平居中使用margin:0px auto;可以实现,但垂直居中使用外边距是无法达到效果的.(页面设置height:100%;是无效的),这 ...