0

私はajaxアプリケーションを持っています。基本的に画像をフォルダーにアップロードし、PHP がそれらを取得して配列に入れます。そこから json_encoded され、echo を介して送り返されます。alert(responseText)jsonバージョンを教えてください。変数を に設定するjson.parse()とconsole.log()、配列として問題なく出力されます。配列は基本的に次のようになります。

1 IMAGE1.jpg
2 IMAGE2.jpg
3 IMAGE3.jpg
4 IMAGE4.jpg
5 IMAGE5.jpg

等

現在、javascript/json オブジェクトになっていることを理解しています。残念ながら、このオブジェクトを操作してすべての画像名とアップロードの真の成功または失敗である最後の配列型を取得することに関する情報は見つかりません。誰かが私にいくつかのドキュメントやこれを操作して配列に情報を推定する方法を教えてもらえますか? 最後に、これらの画像を動的に表示しようとしていますが、アップロードを通じて、すべてが同じ名前ではないと想定しています。

したがって、私の希望は、すべての .jpg/.png./gif などを取得してそれらのファイル名を取得し、ループを使用して正しいファイル名で一連のタグをinnerHTML作成することです。<img>同様に、アップロードが完全に成功したかどうかを示すテキストである配列の最後のピースを処理します。

JSON を使用すべきではありませんか? 私のコードは以下です。

PHP

$dirhandler = opendir(UPLOAD_DIR);
//create handler to directory

//read all the files from directory
$nofiles=0;
while ($file = readdir($dirhandler)) {
    //if $file isn't this directory or its parent
    //echo "FILE SYSTEM: " . $file . "<br/>";
    //add to the $files array
    if ($file != '.' && $file != '..') {
        $nofiles++;
        $files[$nofiles]=$file;
    } //end of if loop
} //end of while loop
//json_encode($files);
if (!$success) { 
    $nofiles++;
    $files[$nofiles] = "Unable to upload file";
    exit;
} else {
    $nofiles++;
    $files[$nofiles] = "File Upload Successfully";
}
echo json_encode($files);

ジャバスクリプト

   if (xhr.readyState === 4 && xhr.status === 200) {
            progressBar.value="100";
            progressText = "Upload Complete!";
            progressStatus.innerHTML = progressText;
            var imageNames = JSON.parse(xhr.responseText);
            alert(imageNames);
        } else if (xhr.readyState === 0 || xhr.readyState === 1) {
            progressBar.value = "25";
            progressText = "Starting Upload..";
            progressStatus.innerHTML = progressText;
        } else if (xhr.readyState === 2) {
            progressBar.value = "50";
            progressText = "Almost Done...";
            progressStatus.innerHTML = progressText;
        } else if (xhr.readyState === 3) {
            progressBar.value = "75";
            progressText = "So Close!";
            progressStatus.innerHTML = progressText;
        } else if (xhr.status === 404 || xhr.status === 500) {
            alert("Your Upload Request failed.");
        }
4

1 に答える 1

0

imageNames特別なオブジェクトではありません。通常のjavascriptオブジェクトと同じように使用してください。例：imageNames[2]2番目の画像名が表示されます。

json_encode()ただし、実際のJS配列として理解できる配列を作成すると、作業がはるかに楽になります。PHPで、明示的なインデックスを使用する代わりに、各画像のエントリを含めます。

$files = array();
$entries = scandir(UPLOAD_DIR);
foreach ($entries as $entry) {
    if (is_file(UPLOAD_DIR.'/'.$entry)) {
        $files[] = $entry;
    }
}
if (!$files) {
    // signal an error with an actual HTTP error code!
    header('Content-Type: application/json', false, 500);
    echo json_encode(array('error'=>'upload failed'));
} else {
    header('Content-Type: application/json');
    echo json_encode($files);
}

ただし、ファイルを処理するときにファイル名を収集する必要があると思います。のような入力要素を含むアップロードフォームを使用してから、次のような<input type="file" name="images[]">スクリプトにアップロードします。

function process_uploaded_files($files, $destdir, $nametmpl) {
    $moved = array();
    foreach ($files['error'] as $key => $error) {
        $newname = FALSE;
        if ($error===UPLOAD_ERR_OK) {
            $source = $files['tmp_name'][$key];
            $destname = sprintf($nametmpl, $key);
            $dest = "{$destdir}/{$destname}";
            if (move_uploaded_file($source, $dest)) {
                // success!
                $newname = $destname;
            }
        }
        $moved[$key] = $newname;
    }
    return $moved;
}

function filename_to_url($filename) {
    // or whatever
    return ($filename) ? '/images/'.$filename : $filename;
}    

$uploaded_files = process_uploaded_files($_FILES['images'], UPLOAD_DIR, 'Image%03d');

// you should always return URLs of resources (not bare filenames) to be RESTful
$new_urls = array_map('filename_to_url', $uploaded_files);
header('Content-Type: application/json');
echo json_encode($new_urls);
于 2013-01-15T18:23:16.133 に答える