文章接上篇
异步上传文件一直是大家经常讨论和新手经常问到的问题
下面还是先来一个例子来说明问题好了
upload.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<SCRIPT LANGUAGE="JavaScript">
<!--
var callbackfun = function(url){
var body = document.getElementsByTagName("body").item(0);
var img = document.createElement ("img");
img.src = url;
body.appendChild (img);
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<form action="test.php?callback=parent.callbackfun" method="post" enctype="multipart/form-data" target="upload">
<input type="file" name="file" id="file" />
<input type="submit" name="submit" value="Submit" />
</form>
<iframe name="upload" style="display:none"></iframe>
</BODY>
</HTML>
test.php
<SCRIPT LANGUAGE="JavaScript">
<!--
<?php
move_uploaded_file($_FILES["file"]["tmp_name"],"upload/" . $_FILES["file"]["name"]);
echo $_GET['callback']."('upload/" . $_FILES["file"]["name"]."')";
?>
//-->
</SCRIPT>
此处其实主要的代码就是标红那里
form表单的target属性可以指向一个iframe来使表单的数据提交到那个iframe里面
那个iframe隐藏起来
然后在提交的页面里面输出js来调用原来页面的javascript 将路径返回回去
实现回调函数
基本上原理就是这样 看到代码基本没有太多困难的地方
基本上就是在iframe里面用js调用父窗口的方法有一点点需要转变的地方
当然这里其实可以用其他方法来实现不过大同小异基本上全部都是讲form的target指向一个iframe