2012-09-08 17 views
1

我有一個腳本工作上傳圖片,而無需刷新使用jquery.form.jsPHP和jQuery的+如何讓jQuery的知道,當一個文件上傳已經完成

下面的頁面是,它揭開序幕的PHP文件處理文件,完成後PHP會創建一個標籤來顯示圖像。

我現在需要一種讓JQUERY知道PHP文件處理已完成的方法。有沒有好的方法來連接這兩個?

我以爲我可以寫一些隱藏到頁面的東西,並讓JQUERY尋找這個,但我不確定這是否是B級解決方案。

任何想法?如果需要,我可以更好地解釋。 thx

<?php 

    $type = $_POST['mimetype']; 
    $xhr = $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest'; 


    foreach($_FILES as $file) { 
      $filename = $file['name']; 
      $filesize = $file['size']; 
      $filetmp = $file['tmp_name']; 
    } 


    // Script Variables 
    $errors=0; 
    $notAllowedFileType=0; 
    $exceededMaxFileSize=0; 
    $maxsize='10485760';         // 10MB Maximum Upload 
    $folder = 'images/'; 
    $configWidth = 500; 
    $newFileName = 'success_story'.time().'.jpg'; 

    // Process if No Errors 
    if(!$errors) { 

     // Variables 
     $uploadedFile = $filetmp; 
     $filename = basename($filename); 
     $extension = strtolower(getExtension($filename)); 

     // Convert the Specific Type of File into an Image 
     if($extension=='jpg' || $extension=='jpeg') { 
      $uploadedfile = $fullfilepath; 
      $src = imagecreatefromjpeg($uploadedFile); 
     }elseif($extension=='png') { 
      $uploadedfile = $fullfilepath; 
      $src = imagecreatefrompng($uploadedFile); 
     }else{ 
      $uploadedfile = $fullfilepath; 
      $src = imagecreatefromgif($uploadedFile); 
     } 

     // Configure Width & Height 
     list($origWidth, $origHeight) = getimagesize($uploadedFile); 
     $configHeight = ($origHeight/$origWidth)* $configWidth; 

     // Create Empty File 
     $tmp = imagecreatetruecolor($configWidth, $configHeight); 
     imagecopyresampled($tmp, $src, 0,0,0,0,$configWidth,$configHeight,$origWidth,$origHeight); 
     imagejpeg($tmp, $_SERVER['DOCUMENT_ROOT'].$folder.$newFileName,90); 

     echo "<img src=".$folder.$newFileName." id=\"cropMeNowImage\">"; 
    } 

    // Get Extension from Uploaded File 
    function getExtension($str) { 
     $i = strrpos($str,"."); 
     if (!$i) {return "";} 
     $l = strlen($str) - $i; 
     $ext = substr($str,$i+1,$l); 
     return $ext; 
    } 
?> 


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
<script> 
(function() { 

    $(document).on('change','img#cropMeNowImage', function() { 
     alert('Ready to Crop'); 
    }); 

})();  
</script> 
+0

它看起來像.load()事件在您的圖像將工作。 http://api.jquery.com/load-event/ –

回答

2

您需要使用回調函數。喜歡的東西:

$(document).on('change','img#cropMeNowImage', function() { 
    $.post(url, { 
     vars_to_server : vars 
    }, function(process_done){ 
     if (process_done) 
      alert("ready"); 

    }) 
}); 

PHP的時候echo東西的jQuery識別在var process_done

相反:

echo "<img src=".$folder.$newFileName." id=\"cropMeNowImage\">"; 

可以echo 1成功

這是想法。這完全有可能。專爲上傳文件通過AJAX的共同任務...


我建議你:5 Ways to Make Ajax Calls with jQuery

看看到http://github.com/valums/file-uploader我總是用它來上傳文件。

相關問題