js上传文件

之前用的也就是form表单上传，还从来没有用过用js上传，form表单只能同步上传，js上传就可以异步上传了。

下面是html部分：
<form method="post" enctype="multipart/form-data">
        选择图片: <input multiple="multiple" id = "file" type="file" name="img"/>
</form>

html部分就是一个简单的form表单，表单上传里 enctype="multipart/form-data"是必须的，js上传这个应该用途不大了，留着吧。onchange监听选择文件事件。

下面是js部分：
<script>
function dupload(o) {
        var formData = new FormData(); // 创建一个form表单对象
        var file = document.getElementById('file').files[0]; // 获取file对象选择的第一个文件
        formData.append('file', file); // 把file对象加入到表单里
        jQuery.ajax({
                url: "plugin.php?id=nciaer_remote_img:upload",
                type: "post",
                data: formData,
                processData: false,
                contentType: false,
                dataType: 'json',
                success: function (res) {
                     // 上传成功，返回图片路径
                },
                error: function (err) {
                }
        })
}
</script>

代码已经注释了，先创建一个form对象，然后往里加file对象，然后通过jquery上传到后台，后台就是通过$_FILES数组来获取上传的文件了。

有个地方需要注意下，一开始我认为file表单也是用getElementById来获取，然后直接append到from对象里就行了，但是后来才知道,file表单对象是一个数组，即使默认只能选择一个文件，那也得用fileObj.files[0]来获取这个对象，如果上传多个文件，则需要用
var formData = new FormData();
var file = document.getElementById('file').files;
for(i=0;i<file.length;i++){
        formData.append("file"+i, file); // 或者formData.append("file["+i+"]", file); 不同方式$_FILES内容不同
}

有关PHP系统、Discuz或网站等各种问题，可以联系QQ1069971363寻求付费支持