最近發現網上轉載不註明出處的文章很多,為了創造一個良好的開源環境.請您轉載後註明出處.謝謝合作!這樣會鼓勵我們的開源慾望.

jquery 這個JS元件不知道大家用過沒有?在有一定的Ajax基礎之後,利用它來開發Ajax是一件非常有趣的事情,一直以來就被Js的傳統程式設計環境所煩的.它可以簡化我的的JS 程式碼,加快你們的開發速度,程式碼一目瞭然.一但有了自己的程式設計習慣之後,那可以說會如魚得水.

今天利用Jquery 的File Upload 元件,再結合Php那簡單的檔案上傳元件,一個非常 高效的Ajax檔案上傳工具就搞定啦.可以實現我們一般的程式要求,下面就和大家分享一下,免得和我一樣在網上找來找去都沒得一個實用的,最後還得自己寫一個.~_~

效果圖如下:

JS程式碼:

<script type="text/javascript" language="javascript">

	function ajaxFileUpload()

	{

		$("#loading")

		.ajaxStart(function(){

			$(this).show();			

		})

		.ajaxComplete(function(){

			$(this).hide();			

		});



		$.ajaxFileUpload

		(

			{

				url:'up.php',

				secureuri:false,

				fileElementId:'fileToUpload',

				dataType: 'html',

				success: function (data)

				{				

					

						

							alert(data);

					

				},

				error: function (data, status, e)

				{

					alert(e);

				}

			}

		)

		

		return false;



	}



	</script>

Php檔案上件處理程式碼:

#--time:2008.07.10--#



#--anthor:fkedwgwy--#



#--QQ群:37304662--#



#--blog:http://blog.csdn.net/fkedwgwy--#



#--歡迎您加入PHP開源的殿堂.--#

function uploadFile($file,$isImage=false){

set_time_limit(0);

	$file_name=$file['name'];

	$file_type=$file['type'];

	$file_tmpname=$file['tmp_name'];

	$file_size=$file['size'];

	$file_error=$file['error'];

	if(!empty($file_name)){

		if($isImage==true){

			if ($file_error==UPLOAD_ERROR_OK) {

				if ($file_type=="image/gif"||$file_type=="image/jpg"||$file_type=="image/pjpeg"||$file_type=="image/jpeg"||$file_type=="image/x-png")

				{

					$upload_path="file/";

					$upload_name=strrchr($file_name,".");

					$upload_name=date("YmdHiss").$upload_name;

					$upload_path=$upload_path.$upload_name;

					if(move_uploaded_file($file_tmpname,$upload_path)){

						return $upload_path;

					}else {						

						$msg="上傳失敗";

					}

				}else {

					$error="圖片格式不對";

				}

			}else {

				$error=$file_error;

			}

		}else {

			if ($file_error==UPLOAD_ERROR_OK) {

				$upload_path="file/";

				$upload_name=strrchr($file_name,".");

				$upload_name=date("YmdHis").$upload_name;		

				$upload_path.=$upload_name;

				if(move_uploaded_file($file_tmpname,$upload_path)){

					return $upload_path;

				}else {

					$msg="上傳失敗";

				}

			}			

		}

	}else {

		if($isImage==true){

			$error="請選擇你要上傳的圖片";

		}else {

			$error="請選擇你要上傳的軟體";

		}

		

	}	

}
 

html部分:

<table cellpadding="0" cellspacing="0" class="tableForm">



   <thead>



    <tr>



     <th>



      fkedwgwy-Ajax_Php_file_upload</th>



    </tr>



   </thead>



   <tbody>



    <tr>



     <td>



      <input id="fileToUpload" type="file" size="45" name="fileToUpload"></td>



    </tr>



    <tr>



     <td>



      請選擇檔案上傳(PHP家園QQ群:37304662)</td>



    </tr>



   </tbody>



   <tfoot>



    <tr>



      <td>



      <button class="button" id="buttonUpload" onclick="return ajaxFileUpload();">



       Upload</button>



      <a href="http://blog.csdn.net/fkedwgwy">http://blog.csdn.net/fkedwgwy</a></td>



    </tr>



   </tfoot>



  </table>



 



原始碼下載地址:http://download.csdn.net/source/533941