iframe實(shí)現(xiàn)Ajax文件上傳效果示例

更新時(shí)間：2013年12月04日 17:32:51 作者：

Ajax文件上傳效果實(shí)現(xiàn)的方法有很多，在本文將為大家介紹下使用iframe是如何實(shí)現(xiàn)的，感興趣的朋友不要錯(cuò)過

 
<span style="font-family: verdana, 'ms song', 宋體, Arial, 微軟雅黑, Helvetica, sans-serif; font-size: 14px; line-height: 21px; text-align: left; background-color: rgb(255, 254, 247); ">avascript部分</span> 

復(fù)制代碼代碼如下:

 
<!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'> 
請(qǐng)選擇文件:<input type='file' name='myFile'/><br/> 
<input type='submit'/> 
<div id='msg'></div> 
</form> 
</body> 
</html> 

//php接收部分

復(fù)制代碼代碼如下:

 
<?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>"; 
?> 

您可能感興趣的文章:

相關(guān)文章

javascript ajax類AJAXRequest2007-12-31 更新
2008-01-01
bootstrap select2 動(dòng)態(tài)從后臺(tái)Ajax動(dòng)態(tài)獲取數(shù)據(jù)的代碼
這篇文章主要介紹了bootstrap select2 動(dòng)態(tài)從后臺(tái)Ajax動(dòng)態(tài)獲取數(shù)據(jù)的代碼，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2019-12-12
JQuery Ajax動(dòng)態(tài)生成Table表格
實(shí)現(xiàn)過程是這樣的：前臺(tái)通過jquery的ajax調(diào)用一般處理程序(Handler),獲取表格需要顯示的信息，然后轉(zhuǎn)換成json格式返回給前臺(tái)，前臺(tái)獲取到數(shù)據(jù)后循環(huán)構(gòu)建表格的行，最好把行附加到表里。感興趣的朋友一起看看吧
2015-09-09
IE瀏覽器與FF瀏覽器關(guān)于Ajax傳遞參數(shù)值為中文時(shí)的區(qū)別實(shí)例分析
這篇文章主要介紹了IE瀏覽器與FF瀏覽器關(guān)于Ajax傳遞參數(shù)值為中文時(shí)的區(qū)別,結(jié)合實(shí)例分析說明了ajax參數(shù)傳遞過程中的參數(shù)轉(zhuǎn)碼相關(guān)注意事項(xiàng)與使用技巧,需要的朋友可以參考下
2015-12-12
ajax處理返回的json格式數(shù)據(jù)方法
今天小編就為大家分享一篇ajax處理返回的json格式數(shù)據(jù)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-08-08
Ajax+PHP簡(jiǎn)單數(shù)據(jù)交互
這篇文章主要為大家詳細(xì)介紹了Ajax+PHP簡(jiǎn)單數(shù)據(jù)交互,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-10-10
基于原生ajax與封裝的ajax使用方法(詳解)
下面小編就為大家?guī)硪黄谠鷄jax與封裝的ajax使用方法(詳解)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-07-07
使用AJAX完成用戶名是否存在異步校驗(yàn)
這篇文章主要介紹了使用AJAX完成用戶名是否存在異步校驗(yàn)的相關(guān)資料,需要的朋友可以參考下
2016-12-12
ajax 動(dòng)態(tài)傳遞jsp等頁(yè)面使用id辨識(shí)傳遞對(duì)象
本文為大家介紹下使用ajax動(dòng)態(tài)傳遞jsp等頁(yè)面，js的jax編寫，使用id辨識(shí)傳遞對(duì)象
2014-01-01
非常簡(jiǎn)單的Ajax請(qǐng)求實(shí)例附源碼
這篇文章為大家推薦了一個(gè)非常簡(jiǎn)單的Ajax請(qǐng)求實(shí)例，可以在不重載頁(yè)面的情況與 Web 服務(wù)器交換數(shù)據(jù)，感興趣的小伙伴們可以參考一下
2015-11-11