javascript - 如何在 joomla 模块中通过 javascript 发送输入文件类型

Question

我想用 javascript 将文件发送到 php 文件。
我的 php 文件中有这个表单

<form action="" method="post" enctype="multipart/form-data">
   <label for="file">Filename:</label>
   <input type="file" name="file" id="file1"><br>
   <p id="poi">upload</p>
   <p id="plo"></p>
</form>

在js文件中写入这段代码

jQuery(document).on("click","#poi",function(){
   var objfile=new FormData();
   var file=jQuery("#file1").get(0).files[0];
   objfile.append("iefile078",file);

   var ajax ;
   ajax.upload.addEventListener("progress" ,progresshandler ,false);
   function progresshandler(){
      jQuery("#plo").text("uploading ....");
   }
   ajax.open("POST","helper.php");
   ajax.send(objfile);
});

当我点击页面上的“上传”时，此功能正确触发。
我想在上传过程中向用户显示“正在上传....”。
另外我想把这个文件发送到 helper.php 文件。
在这种情况下如何将属性设置为 open() 和 send() 函数以传递上传到 helper.php 的文件？
这是我的文件结构和我在 default.php 中的表单位置

js
    jquery.js
tmpl
    default.php
helper.php
mod_upload.php
mod_upload.xml

Answer 1

试试这个:

$(document).on("click","#poi", function(e) {
    e.preventDefault();
    var formData = new FormData($(this)[0]);

    $.ajax({
        url: 'helper.php',
        type: 'POST',
        data: formData,
        async: false,
        beforeSend: function() {
            $("#message1").show().html("uploading...");
        },
        success: function(data) {
            $("#message1").fadeOut();
            $("#container").html(data);
        },
        cache: false,
        contentType: false,
        processData: false
    });
});