這是昨天在應用開發時用到的一款ajax圖片上傳功能了，方法很簡單的就是把文件利用js給iframe來直接上專，如果上傳文件成功返回1,再用js判斷是否上傳成功如果是就輸出圖片並顯示預覽效果。
這是昨天在應用開發時用到的一款ajax圖片上傳功能了，方法很簡單的就是把文件利用js給iframe來直接上專，如果上傳文件成功返回1,再用js判斷是否上傳成功如果是就輸出圖片並顯示預覽效果。
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>ajax文件上傳</title>
<style type="text/css教程">
#f1_upload_process { display:none;}
</style>
<script language="網頁特效" type="text/javascript">
<!--function $(id)
{
return document.getelementbyid(id);
}function startupload(){
if( $('myfile').value =='' )
{
alert('請選擇要上傳圖片！');
return false;
}
var array = $('myfile').value.split('.');
var ext = array[1].tolowercase();
if( ext =="gif" || ext =="jpg" || ext =="png" )
{
$('f1_upload_process').style.display = 'block';
$('f1_upload_form').style.display = 'block';
return true;
}
else
{
alert('只允許上傳gif jpg png格式圖像文件！');
return false;
}
}function stopupload(success,pic){
var result = '';
if (success ==1 ){
result ='<img src='+pic+' />';
$('logo').value=pic;
}
else {
result = '<span class="emsg">logo圖片上傳失敗，請聯系開發人員!</span><br/><br/>';
}
$('f1_upload_process').style.display = 'none';
$('f1_upload_form').innerhtml = result + '<br /><label><input name="myfile" type="file" size="30" /></label><label><input type="submit" name="submitbtn" class="sbtn" value="上傳圖片" /></label>';
$('f1_upload_form').style.display = 'block';
return true;
}//-->
</script>
</head><body>
<form action="upload.php教程" method="post" enctype="multipart/form-data" target="upload_target" onsubmit="javascript:return startupload();" >
<span id="f1_upload_process"><img src="loader.gif" /></span>
<span id="f1_upload_form" align="center">
<input name="myfile" type="file" id="myfile" size="30" />
<input type="submit" name="submitbtn" class="sbtn" value="上傳圖片" />
</span>
<iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
(可上傳 gif,jpg,png)
</form>
</body>
</html>
upload.php
<?php
$destination_path = '../../upfile/jianjulogo/';//getcwd().directory_separator;$result = 0;
$target_path = $destination_path . basename( $_files['myfile']['name']);if(@move_uploaded_file($_files['myfile']['tmp_name'], $target_path)) {
$result = 1;
}
echo $target_path;
sleep(1);
?>
<script language="javascript" type="text/javascript">window.top.window.stopupload(<?php echo $result; ?>,'<?=$target_path?>');</script>
