form文件上传,防止页面刷新

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>文件上传form提交</title>
</head>
<body>
<form id="form" method="post" enctype="multipart/form-data" target="iframe" action="upload.php">
<p>Upload File: <input type="file" name="Filedata" /></p>
<p><input type="submit" value="Submit" id="submit"/></p>
</form>
<iframe name="iframe" style="display:none;" id="iframe" ><p></p></iframe>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(function(){
$("#submit").click(function(){
$("#form").submit();
});

var iframe = document.getElementById('iframe');
var repose="";
if(iframe.attachEvent){//ie
iframe.attachEvent("onload", function(){
var win1 = document.getElementById('iframe').contentWindow;
repose= win1.document.body.innerHTML ;
repose=eval('(' + repose + ')');
$("#form").append("<div><img src='"+repose.data.img+"'/></div>");
});
}else{//chrome,ff
iframe.onload = function(){
var win2 = document.getElementById('iframe').contentWindow;
repose= win2.document.body.innerHTML ;
repose=eval('(' + repose + ')');
$("#form").append("<div><img src='"+repose.data.img+"'/></div>");
};
}




});
</script>
</body>
</html>

原文地址:https://www.cnblogs.com/xiaotaiyang/p/3835077.html