如何使用ajax上传文件？-Java 学习之路

HTML：

<form id="confirmresourceform" enctype="multipart/form-data" method="post" style="display: none;">
              <input id="uploadlecture" name="fileToUpload1" type="file" value="Upload Resources"/>
           </form>

使用Javascript / jQuery的/阿贾克斯：

$("#submitchanges").on("click",function(){
    //Upload files
    var formData = new FormData(document.getElementById("confirmresourceform"));
    formData.append('lecture', $('#uploadlecture')[0].files[0]);
    $.ajax({
        type: 'POST',
        url: 'upload.php',
        contentType: false, 
        processData: false,
        data: formData,
         success: function (data) {
           console.log(data);
         }
    });
});

PHP（upload.php的）：

echo $_FILES['lecture']['name'];

好的，所以我试图使用ajax上传文件（点击div而不是使用提交表单的东西） . 我已经得到jQuery将文件数据附加到formdata与关键'讲座' . 目前upload.php脚本有一行来回显文件名 . 但是，当ajax运行并调用upload.php时，我收到以下错误：

未定义的索引：第4行的C：\ wamp \ www \ TheClass \ lesson_creator_page \ upload.php讲座

我在formdata中定义了'lecture'并将formdata传递给了php . 有什么我做错了，这条线是正确的吗？

2 回答

几个月前我遇到了同样的问题并通过“.ajaxFileUpload”执行以下操作解决了这个问题：

在你的jquery中，集合如下所示：

jQuery.ajaxFileUpload({
            url             : "upload.php",
            secureurl       : false,
            fileElementId   : "fileToUpload1",
            dataType        : 'json',
            data            : {
               // if you have another data to pass in your phhp     
            },
            success : function ()
            {

             },
            error  : function(){

            }
        });

回复于 2024-04-25T08:31:55+08:00

1

关于此，网上有很多文献 .

使用Ajax进行文件上传的最佳方法是使用插件 . 以下是几个供您考虑的事项：

来自：How can I upload files asynchronously?

多文件上传插件迷你多文件上传jQuery文件上传您可以从jQuery的插件站点搜索更多内容 .

如果您不想使用插件，那么最好的办法就是使用iFrame .

您也可以使用javascript的文件API，但并非所有浏览器都支持 . 点击这里：https://developer.mozilla.org/en/docs/Web/API/File

编辑：如果你想更加漂亮，你可以开发一个JAVA或SWF应用程序嵌入你的页面来做到这一点 .

回复于 2024-04-25T08:31:55+08:00

如何使用ajax上传文件？

2 回答

相关问题