1

jquery.form.jsを使用してページを更新せずに画像をアップロードするスクリプトがあります

以下は、ファイルのプロセスを開始する PHP ファイルです。終了すると、PHP は画像を表示するタグを作成します。

次に、PHP ファイルの処理が完了したことを JQUERY に知らせるメソッドが必要です。この2つを接続する良い方法はありますか?

ページに隠したものを書き込んで JQUERY にこれを検索させることができると思いましたが、これが B グレードのソリューションかどうかはわかりません。

何か案は?必要に応じて、より適切に説明できます。どうも

<?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>
4

1 に答える 1

2

コールバック関数を使用する必要があります。何かのようなもの:

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

    })
});

php はecho、var 内の jquery によって認識可能なものでなければなりませんprocess_done

その代わり:

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

あなたはecho 1成功することができます

これがアイデアです。それは完全に可能です。特に、AJAX 経由でファイルをアップロードするという一般的なタスクのために...


次のことをお勧めします: jQuery で Ajax 呼び出しを行う 5 つの方法

http://github.com/valums/file-uploaderを見てください。私は常にファイルのアップロードに使用しています。

于 2012-09-08T04:02:03.590 に答える