您的位置：首页 > 编程语言 > PHP开发

php利用iframe实现无刷新文件上传功能

2013-08-07 18:45 1211 查看

上传原理很简单就是利用表单的打开方式为iframe的name名，这样就可以在当前页面的iframe打来了，实现文件上传，再利用js返回上传结果。

form target .在 action 属性中规定的页面会在新窗口中打开。如果是iframe，则在此iframe中打开。

phpAjaxUpload.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function startUpload()
{
document.getElementById('processing').innerHTML="正在上传中";

}
function stopUpload(result)
{
var msg;
switch(result)
{
case 0:
msg="上传成功";
break;
case 1:
msg='文件大小超过限制';
break;
case 2:
msg='只能上传图片文件';
break;
case 3:
msg='move_uploaded_file失败';
break;
case 4:
msg="其他错误";
break;
default:
break;
}
document.getElementById('processing').innerHTML=msg;
alert(msg);
}
</script>

</head>

<body>

<div id="processing">结果信息</div>
<form action="phpAjaxUpload2.php" method="post" enctype="multipart/form-data"  target="uploadFrame" onsubmit="startUpload()">
<label for="myFile">上传文件</label>
<input type="hidden" name="MAX_FILE_SIZE" value="1024000" /><input  type="file" name="myFile" id="myFile" />
<input type="submit" name="submit" value="上传" />

</form>
<iframe  name="uploadFrame"  style="width:0;height:0; border:0;"></iframe>

</body>
</html>

上面的iframe中设置width，height为0，还有一点border为0，否则还是有一点边框。注意

MAX_FILE_SIZE要仔细设定，如果文件大小大于它，那么php端$_FILES['image']['size']就会为0.

phpAjaxUpload2.php

hello
<?php
$result;
if(isset($_POST['submit']))
{

$dir='asaph/';
$maxSize=1*pow(2,20);
$fileTypes=array('jpg','png','gif','bmp');
$myFileType=substr($_FILES['myFile']['name'],strpos($_FILES['myFile']['name'],'.')+1);

if($_FILES['myFile']['size']>$maxSize)
{
$result=1;
}
else if(!in_array($myFileType,$fileTypes))
{
$result=2;
}
else if(is_uploaded_file($_FILES['myFile']['tmp_name']))
{
$dest=$dir.$_FILES['myFile']['name'];
if( @move_uploaded_file($_FILES['myFile']['tmp_name'],$dest))
{
$result=0;
}
else
{
$result=3;
}
}
else
{
$result=4;
}
}

?>
<script type="text/javascript">
window.top.stopUpload(<?php echo $result;?>);
</script>

更多：/article/3749167.html
input file美化看：http://www.oschina.net/code/snippet_273800_20312

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航