2

私は2つのファイル index.js を使用し、upload.php は ajax を介してファイル (img) をアップロードしようとし、成功した場合は div に追加しますuploadfile_show。
しかし、それは機能しません。質問はほとんどありません。以下は私のコードの提案ですか?

ありがとう。

upload.php
1.form enctypeまだ追加する必要がありますか?
2. if($_FILES)$_FILES のサイズまたは tmp_name がまだ使用されている$_FILESかを確認します。

if($_FILES){
    $filename = $_FILES['uploadfile']['name'];
    $filetmp = $_FILES['uploadfile']['tmp_name'];
    $filesize = $_FILES['uploadfile']['size'];
    if($filesize < 1000000){
        move_uploaded_file($filetmp,'upload/tmp/'.$filename);
        print"
            upload success
            <img src=\"upload/tmp/$filename\">
        ";
    }
    else{
    }
}
else{
    print"
        <div class=\"uploaddiv\">
            <form enctype=\"multipart/form_data\">
                <input type=\"type\" name=\"uploadfile\">
                <input type=\"submit\" value=\"upload\" class=\"btn\">
            </form>
        </div>
    ";
}
print"
    <div class=\"uploadfile_show\"></div>
";

index.js
3. この数行は正しいですか?
var uf = $('.uploaddiv form');var fd = new FormData(uf);fd.append('uploadfile', uploadfile);
data: fd,
4. 見逃したことや間違ったことはありますか?

$('.btn').click(function(){
    var uf = $('.uploaddiv form');
    var fd = new FormData(uf);
    fd.append('uploadfile', uploadfile);
    $.ajax({
        type: "POST",
        url: "upload.php",
        data: fd,
        processData:false,
        contentType: false,
        success: function(html){
            $('.uploadfile_show').append(html);
        }
    });
});
4

1 に答える 1

2

FormDatajQueryオブジェクトではなくコンストラクターでフォーム要素を取ります。また、ajaxを使用してフォームを送信しているため、次の呼び出しによってデフォルトのアクション（つまり送信）を防ぐ必要があります。preventDefault()

$('.btn').click(function(e){
    e.preventDefault();
    var uf = $('.uploaddiv form');
    var fd = new FormData(uf[0]);
    $.ajax({
        type: "POST",
        url: "upload.php",
        data: fd,
        processData:false,
        contentType: false,
        success: function(html){
            $('.uploadfile_show').append(html);
        }
    });
});
于 2013-01-24T06:43:09.027 に答える