iframe实现Ajax文件上传效果

来源：互联网发布：java 10 编辑：程序博客网时间：2024/05/29 16:27

avascript部分
<!doctype html><html><head><meta charset=utf-8><head><title>ajax 文件上传~~</title></head><script>window.onload=function(){    var form=document.getElementsByTagName('form')[0];    form.onsubmit=function(){        var iframe=document.createElement('iframe');        iframe.src='do_upload.php';        var iframe_name="iframe"+Math.random();        iframe.name=iframe_name;        document.body.appendChild(iframe);        iframe.style.width='0px';        iframe.style.height='0px';                iframe.frameBorder='0';        form.target=iframe_name;                }}</script><body><form enctype='multipart/form-data' method='post' action='do_upload.php'>请选择文件:<input type='file' name='myFile'/><br/><input type='submit'/><div id='msg'></div></form></body></html>

//php接收部分

<?php$up_file=$_FILES['myFile'];if($up_file['error']===0){    if(!file_exists('./imgs')){            mkdir('./imgs');    }    $save_name=rand().$up_file['name'];    $bool=move_uploaded_file($up_file['tmp_name'],"./imgs/$save_name");    if($bool){        $msg='上传成功!';    }else{        $msg='上传失败!';    }}echo "<script>var msg=parent.document.getElementById('msg');msg.innerHTML='<font color=red>$msg</forn>';</script>";?>