0

私のコードは、コンソールでエラーを生成しません。アップロード ボタンをクリックしても何も起こりません。私が使用したチュートリアルで指示されているように、それ自体に送信された投稿がありますが、画像は自分のフォルダーにアップロードされず、自分のページには表示されません。jquery を使用する必要があることを知っているという事実を除けば (フォルダーにアップロードするようになったら移行します)、コードの何が問題になっていますか?

<?php

if (!empty($_FILES)) {
    $name = $_FILES['file']['name'];

    if ($_FILES['file']['error'] == 0) {move_uploaded_file($_FILES['file']
            ['tmp_name'], "post_images/" . $name))} 
}

?>



<script type="text/javascript">

var handleUpload = function (event) {
event.preventDefault();
event.stopPropagation();

var fileInput = document.getElementById('file');
var data = new FormData();  
data.append('file', fileInput.files[1]);    
var request = new XMLHttpRequest();
request.upload.addEventListener('progress', function(event){
    if (event.lengthComputable) 
    {
    var percent = event.loaded / event.total;
    var progress = document.getElementById('upload_progress');
    while(progress.hasChildNodes()) {
        progress.removeChild(progress.firstChild);          
    }   

progress.appendChild(document.createTextNode(Math.round(percent * 100) + 
    '%'));          

}

});

request.upload.addEventListener('load',function(event) {
document.getElementById('upload_progress').style.display = 'none';
});

request.upload.addEventListener('error', function(event) {
alert('Upload failed');
});

request.open('POST', 'upload.php');
request.setRequestHeader('Cache-Control', 'no-cache');
document.getElementById('upload_progress').style.display = 'block';
request.send(data); 

};


window.addEventListener('load', function(event) {
var submit = document.getElementById('submit');
submit.addEventListener('click', handleUpload);
});

</script>


<div id="uploaded">

<?php

if (!empty($name)) {

echo '<img src="post_images/' . $name . '" width="100" height="100" />';    

}

?>

</div>

<div id="upload_progress"></div>

<div>

<form action="" method="post" enctype="multipart/form-data">

<div>

    <input type="file" id="file" name="file" />
    <input type="submit" id="submit" value="upload" />

</div>

</form>

</div>
4

1 に答える 1

1

複数ファイル以外の入力要素にファイルが 1 つしかないfileInput.files[1]場合は、2 番目のファイルを使用しようとします。

data.append('file', fileInput.files[0]);
于 2012-09-15T03:23:21.137 に答える