PHP Ionic Angular Phonegap AJAX Javascript CSS MySQL jQuery Forum


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

17 October 2008 By
upload preview

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ upload preview





สร้างโฟลเดอร์สำหรับเก็บไฟล์ชั่วคราว ชื่อ 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']);
	}
?>

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



   เพิ่มเติมเนื้อหา ครั้งที่ 1 วันที่ 27-06-2017


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






Tags:: preview upload






อย่าลืมกด Like กด Share เป็นกำลังใจ ในการสร้างบทความใหม่ๆ น่ะครับ


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