关于无刷新的文件上传。

最新推荐文章于 2024-09-22 11:17:00 发布

lifuan

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量662

点赞数

文章标签： upload javascript ajax prototype file class

本文链接：https://blog.csdn.net/lifuan/article/details/3594390

版权

昨天做我的.net的Ajax项目时，需要一个无刷新的文件上传功能。查阅了大量的资料并且实验了很多自认为可行方法之后，发现通过javascript去创建一个文件上传的控件几乎是不可能的，这是由于javascript自身的一些安全限制造成的。也有一些使用第三方的空间或封装包的方法，但都不是真正的ajax，仅仅是在感官上对ajax异步的模仿。而且开发者使用这些第三方包也存在很多的不便。经过仔细的筛选，发现以下方法是使用最广，最方便的，也是最易理解的。

在页面上使用如下代码(注意，其中的iframe起到了关键的作用。);

<body>

<p id="f1_upload_process">Loading...<br/><img src="loader.gif" /></p>

File: <input name="myfile" type="file" />

</form>

</body>

//点击Upload按钮是使用如下函数

Upload

function startUpload(){

document.getElementById('f1_upload_process').style.visibility = 'visible';

return true;

}

//上传完之后，执行以下的回调函数。

function stopUpload(success){

var result = '';

if (success == 1){

document.getElementById('result').innerHTML =

'<span class="msg">The file was uploaded successfully!<//span><br/><br/>';

}

else {

document.getElementById('result').innerHTML =

'<span class="emsg">There was an error during file upload!<//span><br/><br/>';

}

document.getElementById('f1_upload_process').style.visibility = 'hidden';

return true;

}

这个方法是不错，但是没有进行封装，使用上还不是非常方便。最近忙着赶项目，也没时间去封装一下。如果谁有时间的话，帮我封装一下，最好用prototype框架(呵呵，这是我个人的爱好，当然也可以用别的框架)。我的邮箱是：lifuan.china@gmail.com。如果哪天那位好友给封装了，记得给我来个邮件啊。谢谢。