PHP Ionic Angularjs Phonegap AJAX Javascript CSS MySQL jQuery Forum

แสดงตัวอย่างรูป ก่อน upload image preview berfore upload

17 October 2008 By




สร้างโฟลเดอร์สำหรับเก็บไฟล์ชั่วคราว ชื่อ temp

Code ไฟล์ image_preview.php

<script language="javascript">
function show_pic(sc){
	document.form1.action='php_upload.php';
	document.form1.target='mypre';
	document.form1.submit();	
}
</script>

<span id="mypic1"></span>
<form id="form1" name="form1" enctype="multipart/form-data" method="post" action="">
  <input type="file" name="file" onchange="show_pic(this.value);" />
  <input type="submit" name="Submit" value="Submit" />
</form>
<iframe name="mypre" width="0" height="1" frameborder="0"></iframe>

Code ไฟล์ php_upload.php

<?php
function upimg($img,$imglocate){
			global $file_up;
			if($img['name']!=''){
			$fileupload1=$img['tmp_name'];
			$g_img=explode(".",$img['name']);
			$file_up=time().".".$g_img[1];
				if($fileupload1){
					$array_last=explode(".",$file_up);
					$c=count($array_last)-1;
					$lastname=strtolower($array_last[$c]);
					if($lastname=="gif" or $lastname=="jpg" or $lastname=="jpeg" or $lastname=="swf"){					
						@copy($fileupload1,$imglocate.$file_up);			
					}	
				}				
			}
}
if($_FILES['file']['name']!=""){
	upimg($_FILES['file'],"temp/");
	echo "<script language=\"javascript\">";
	echo "var pl=top.document.getElementById('mypic1');";
	echo "pl.innerHTML=\"<img src='temp/".$file_up."' width='50' height='50' />\";";
	echo "top.document.form1.action='';";
	echo "top.document.form1.target='';";
	echo "</script>";
	echo "<meta http-equiv=\"Refresh\" content=\"0;URL=php_upload.php?d_img=".$file_up."\" />";
}
?>
<?php
	if($_GET['d_img']!=""){
		@unlink("temp/".$_GET['d_img']);
	}
?>

คลิกดูตัวอย่างผลลัพธ์ได้ที่นี้ คลิก


Tags:: upload preview



เนื้อหานี้ ล้าสมัยแล้ว ลองใช้เป็น html5 ตามตัวอย่างนี้แทน
http://www.ninenik.com/content.php?arti_id=551


URL สำหรับอ้างอิง