Question

我尝试通过jQuery将文件发送到PHP文件进行处理。

<form action="help-uploader.php" method="POST" class="signup" id="upform" enctype="multipart/form-data">

   <input type="text" id="title" name="title" tabindex="1" value="">
   <input id="file" type='file'" />
   <button class="submitbtn" id="submit">submit</button>
</form>

和jQuery：

$(document).ready(function(){
        $('#submit').click(function (e) {
        // custom handling here
            e.preventDefault();
            var ititle = $("#title").val();
            var ifile = $("#file").val();

            $.post("help-uploader.php",
                {
                    title: ititle,
                    file: ifile
                },function(data, status){alert("Data: " + data + "\nStatus: " + status);});
        });
    });

和**help-uploader.php**

<?php
echo $_POST['file'];
echo basename($_FILES["file"]["name"]);
?>

第一个ECHO在客户端打印文件路径。

第二个ECHO没有打印任何东西。

如何通过jQuery正确地将文件发送到PHP？

Answer 1

您需要使用formdata。我提供了一个示例函数，它接受参数，即形式引用和函数回调来做东西。这个函数在表单提交上绑定事件。请尝试以下 -

function sendAjaxForm(frm,callbackbefore,callbackdone)
    {
        var form = frm;
        form.submit(function(event){
            event.preventDefault();
            var formData = new FormData(this);
            var ajaxReq=$.ajax({
                url: $(this).attr('action'),
                type: $(this).attr('method'),
                data: formData,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                beforeSend: callbackbefore
                });
            ajaxReq.done(callbackdone);
        }); // submit done
    }

现在按照示例中的那样调用该函数

sendAjaxForm($('#upform'),function(){alert('sending');},function(data){alert("Data: " + data);})

Answer 2

您需要使用xmlhttprequest来利用$.post()。使用ajax执行文件上传时不应使用xmlhttprequest因为它不使用$.ajax()而应使用xmlhttprequest或本机js submit。

当您使用jQuery时，您可以使用表单$(document).ready(function(){ $('#upform').submit(function(e){ e.preventDefault(); var fd = new FormData(document.querySelector(this)); $.ajax({ url: "help-uploader.php", type: "POST", data: fd, cache:false, // do not cache processData: false, // required contentType: false // required success:function(data){ console.log(data); }, error:function(err){ console.log(err); } }); }); });代替：

dict

如何通过jQuery将文件发送到php？

2 个答案: