Question

这是我的代码在单击浏览并选择图像时，我应该获得图像细节

（function（）{

var input = document.getElementById("uploaded_file");




    formdata = false;

警报（ “S”）;

    formdata = new FormData();





input.addEventListener("change", function (evt) {alert("AS");




    var i = 0, len = this.files.length, img, reader, file;






    for ( ; i < len; i++ ) {




        file = this.files[i];






            if (formdata) {





                formdata.append("images[]", file);





            }






    }






    if (formdata) {





        $.ajax({





            url: "upload.php",





            type: "POST",





            data: formdata,




            processData: false,





            contentType: false,




            success: function (res) {




                document.getElementById("response").innerHTML = res; 




            }





        });




    }





}, false);

}（））;

这里的错误是在mozilla中输入“输入为空”

如果在PHP中，我可以拿$ _FILES ......但我需要以其他方式接受

Answer 1

您选择的文件将位于此处

$('input[type="file"]')[0].files[0]

的Ajax

$('input[type="file"]').on('change',function(){
    $.ajax({
        type:'POST',
        url:'upload.php',
        data:{file:this.files[0]},
        beforeSend:function(xhr){
            //validation here.
            if(this.files[0].size>5120){
                xhr.abort();
                console.log('file was too large');
            }
        },
        success:function(result){
            console.log(result);
        }
    });
});

使用jQuery选择器和事件处理程序比使用标准javascript更容易。但！我提供的上述方法仅适用于1.7及更高版本。不要忘记将jQuery函数包装在文档就绪函数中，如下所示。以下方法适用于1.6.4。

$(document).ready(function(){
    $('input[type="file"]').change(function(){
        $.ajax({
            type:'POST',
            url:'upload.php',
            data:{file:$(this).files[0]},//not sure if 'this' will work within this function
            beforeSend:function(xhr){
                if($(this).files[0].size>5120){
                    xhr.abort();//stops the ajax from executing
                }
            },
            success:function(result){
                console.log(result);
            }
        });
    });      
});

使用jQuery库可以更容易地将选择器和事件侦听器应用于DOM元素。

$('input[type="file"]').change(function(){/*Ajax here*/});

是jQuery中具有事件侦听器的选择器。类似于以下内容：

eles=document.getElementsByTagName('input');
for(i=0;i<ele.length;i++){
    if(ele[i].getAttribute('type')=='file')ele[i].addEventListener('change',function(){/*Ajax here*/},false);
}

有点像那样。我上面写的可能要复杂得多。 More on jQuery selectors.

我在formData上记不起来了，但我之前已经写过类似的内容了

var data=new formData();
jQuery.each($('input[type="file"]')[0].files,function(i,file){data.append('file-'+i,file);});

这样，多个文件会附加到data。到目前为止，我还没有遇到过单独发送files[0]的问题。但是我必须有一个原因在过去使用formData。

我需要通过ajax将文件发布到php。我无法做到

1 个答案: