jQuery不使用插件及swf实现无刷新文件上传
更新时间：2014年12月08日 17:34:10 投稿：hebedich
这篇文章主要介绍了jQuery不使用插件及swf实现无刷新文件上传,需要的朋友可以参考下
文件上传是网站常用的功能，例如附件或图片的上传功能，解决方案也有很多，我们今天介绍一种通过jQuery无刷新的文件上传方式。
首先，我们在页面中放一个form，用来上传文件：
复制代码 代码如下:
<form id="myForm" method="post" action="/asyncFileUpload/UploadHandler.ashx"
enctype="multipart/form-data" target="asyncTarget">
<span>文件：</span>
<input type="file" name="myFile" />
</form>
<input type="button" value="上传" id="btnUpload" />
然后，在页面中放一个iframe，在上传的时候只刷新iframe，而不是整个网页：
复制代码 代码如下:
<iframe name="asyncTarget" style="display: none;"></iframe>
接下来使用js为按钮添加功能：
复制代码 代码如下:
<script>
$(function () {
$("#btnUpload").click(function () {
$("#myForm").submit();
});
});
</script>
在按钮单击的时候，将form提交。
这个方案可以简单的实现无刷新的文件上传。它的实现思路是：将form提交到一个iframe中，其它的处理就像处理普通的form提交一样了。
这个方案的待完善地方是如何判断上传完成，目前只有一个思路：通过js监听iframe的readystate，然后解析iframe的内容。
相关文章
jQuery prototype冲突的2种解决方法(附demo示例下载)
这篇文章主要介绍了jQuery prototype冲突的2种解决方法,分析了针对jQuery中添加代码与冲突位置添加代码2种情况,并附带demo示例供读者下载参考,需要的朋友可以参考下2016-01-01
用 jQuery 的都知道，jQuery 的 get 和 post 方法有三个参数：地址，数据 和 回调函数，但我们知道地址也可以跟随数据的（形如：get_data.php?v1=1&v2=2），而且第二个参数可以省略，即第二个参数可以直接写回调函数，那么数据写在地址后面和写在 data 参数里有什么区别呢？2009-11-11
这篇文章主要介绍了jQuery实现带动画效果的多级下拉菜单代码,可实现点击渐隐渐显效果,涉及jQuery页面元素的遍历及链式操作相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-09-09
当点击添加时自动弹出窗口，填写完毕按确定自动添加到table表格中，有需要的朋友可以参考一下2013-11-11
jquery为我们提供了操作数组和对象的工具函数，方便和简化了我们对它们的操作。今天我们就进入jQuery的工具函数的复习。2010-04-04
这篇文章主要介绍了jQuery实现简易的输入框字数计数功能,结合实例形式分析了jQuery针对页面元素属性的获取与计算相关操作技巧,需要的朋友可以参考下2017-01-01
基于jquery的当鼠标滚轮到最底端继续加载新数据思路分享(多用于微博、空间、论坛 )
基于jquery的当鼠标滚轮到最底端继续加载新数据思路分享(多用于微博、空间、论坛 )，需要的朋友可以参考下。2011-10-10
下面小编就为大家带来一篇jQuery中实现prop()函数控制多选框(全选,反选)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-08-08
下面小编就为大家带来一篇jquery弹出遮掩层效果【附实例代码】。小编觉得挺不错的，现在分享给大家，也给大家做个参考，一起跟随小编过来看看吧2016-04-04
基于jQuery的360图片展示实现代码，需要的朋友可以参考下2012-06-06
最新评论