Js dynamically creates an upload form with an iframe to simulate Ajax without refreshing

 
<script> 
window.onload=function(){ 
upfile('file.php'); 
} 


 
function upfile(url){ 
//Create an iframe
var iframe = document.createElement("iframe"); 
document.body.appendChild(iframe); 
iframe.id = 'iframeName'; 
iframe.name = 'iframeName'; 
iframe.style.display = 'none'; 
//Create a form
var turnForm = document.createElement("form"); 
document.body.appendChild(turnForm); 
turnForm.method = 'post'; 
turnForm.action = url; 
turnForm.encoding = "multipart/form-data"; 
turnForm.name = 'formNamer'; 
turnForm.target = 'iframeName'; 
//Creating hidden forms
var newElement = document.createElement("input"); 
newElement.setAttribute("name","inputname"); 
newElement.setAttribute("type","file"); 
newElement.setAttribute("value",''); 
turnForm.appendChild(newElement); 
} 

//Submit the form
function formSubmit() { 
//var res = document.formNamer.inputname.value; 
document.formNamer.submit(); 
} 

//The return value
function callback(result){ 
//Window. The parent. The document. The getElementById (' iframeName) style. The display = 'block'; View the background data through the iframe
if(result['error'] == 0){ 
document.getElementById('test').src= result['img'][1]+'/'+result['img'][2]; 
}else if(result['error'] == 1){ 
alert(result['meg']); 
}else if(result['error'] == 2){ 
alert(result['meg']); 
}else if(result['error'] == 3){ 
alert(result['meg']); 
}else if(result['error'] == 4){ 
alert(result['meg']); 
}else{ 
alert(result['meg']); 
} 

} 

</script> 

<a href="javascript:formSubmit()"> upload </a> 
<img src="http://blog.163.com/zhwxl_zyx/blog/img/pasic.jpg" id="test" width="200" height="200"> 

 
<?php 
header("content-Type: text/html; charset=Utf-8"); 

if(@is_uploaded_file($_FILES['inputname']['tmp_name'])){ 

$f = $_FILES['inputname']; 
$name = $f["name"]; 
$size = $f["size"]; 
$type = $f["type"]; 
$fileName = $f["tmp_name"]; 

switch ($type) { 
case 'image/jpg':$okType = true; 
break; 

case 'image/jpeg':$okType = true; 
break; 

case 'image/png':$okType = true; 
break; 

case 'image/gif':$okType = true; 
break; 
} 

if($okType){ 
$error = $f["error"]; 
echo ' The file name :'.$name.'<br>'; 
echo ' The file type :'.$type.'<br>'; 
echo ' The file size :'.round($size/1024).'K<br>'; 
echo ' File temporary storage path :'.$fileName.'<br>'; 

$fileDir = dirname(__FILE__).'/img/upfile'.time().$name; 
$img = explode('/',$fileDir); 

move_uploaded_file($fileName, $fileDir); 

$data = array(); 
$data['img'] = $img; 
$data['name'] = $name; 
$data['type'] = $type; 
$data['size'] = $size; 
$data['filename'] = $fileName; 
$data['fileDir'] = $fileDir; 

if($error==0){ 
/*echo ' Uploaded successfully !'; 
echo ' preview :'; 
echo "<img src="http://blog.163.com/zhwxl_zyx/blog/.$img[1].'/'.$img[2]." width='200' height='200'><br>"; 
echo ' The file name '.$img[2];*/ 
$data['error'] = 0; 
exit("<script>parent.callback(".json_encode($data).");</script>"); 

}elseif($error==1){ 
$data['error'] = 1; 
$data['meg'] = ' Exceeded the file size in php.ini Set in file '; 
exit("<script>parent.callback(".json_encode($data).");</script>"); 
}elseif ($error==2){ 
$data['error'] = 2; 
$data['meg'] = ' It exceeds the size of the file MAX_FILE_SIZE Option to specify the value '; 
exit("<script>parent.callback(".json_encode($data).");</script>"); 
}elseif ($error==3){ 
$data['error'] = 3; 
$data['meg'] = ' Only part of the file is uploaded '; 
exit("<script>parent.callback(".json_encode($data).");</script>"); 
}elseif ($error==4){ 
$data['error'] = 4; 
$data['meg'] = ' No files were uploaded '; 
exit("<script>parent.callback(".json_encode($data).");</script>"); 
}else{ 
$data['meg'] = ' The uploaded file size is 0'; 
exit("<script>parent.callback(".json_encode($data).");</script>"); 
} 

} 
}else{ 
$data['error'] = 4; 
$data['meg'] = ' No files were uploaded '; 
exit("<script>parent.callback(".json_encode($data).");</script>"); 
} 
?>