iframe实现上传文件

最新推荐文章于 2021-08-05 14:59:46 发布

useebao

最新推荐文章于 2021-08-05 14:59:46 发布

阅读量127

点赞数

文章标签： Opera HTML

本文链接：https://blog.youkuaiyun.com/useebao/article/details/83528977

版权

上传页面

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>upload file </title> 
<script type="text/javascript"> 
function callback(msg) 
{ 
	//document.getElementById("file").outerHTML = document.getElementById("file").outerHTML; 
	document.getElementById("msg").innerHTML = " <font color=red>"+msg+" </font>"; 
} 
var fload = true;
function f1(){
	if(fload){fload = false;return;}
	var r = getIFrameContent("hidden_frame");
	alert(r);
}
//取iframe的innerHTML
function getIFrameContent(id){
   var bobo=document.getElementById(id); 
   if (document.getElementById){
     if (bobo && !window.opera){
         if (bobo.contentDocument){
               return bobo.contentDocument.body.innerHTML;
         }else if(bobo.Document){
               return bobo.Document.body.innerHTML;
         }
     }
   }
}

</script> 
</head> 
<body> 

<form action="upload.html" id="form1" name="form1" encType="multipart/form-data"  method="post" target="hidden_frame" > 
<input type="file" id="file" name="file" style="width:450"> 
<INPUT type="submit" value="上传文件"> <span id="msg"> </span>
</form> 
<iframe name='hidden_frame' id="hidden_frame" style="display:none" onload="f1();"></iframe>
</body> 
</html>

上传结果返回页面

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>upload file </title> 
</head> 
<body> 

</body> fds
</html> 

<script type="text/javascript"> 
parent.callback('upload file success');
</script>