使用 jquery post 上传 PHP 文件

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11046684/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 23:39:12  来源:igfitidea点击:

PHP file-upload using jquery post

phpjqueryfile-upload

提问by Shiv

Let me know if anyone know what is the issue with this code.

如果有人知道此代码有什么问题,请告诉我。

Basically i want to upload a file using jQuery

基本上我想使用 jQuery 上传文件

<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>

  <script type="text/javascript">
    $(document).ready(function(event) {
      $('#form1').submit(function(event) {
        event.preventDefault();
        $.post('post.php',function(data){
           $('#result').html(data);
        });
      });
    });
  </script>  
</head>
<body>
<form id="form1">
  <h3>Please input the XML:</h3>
  <input id="file" type="file" name="file" /><br/>
  <input id="submit" type="submit" value="Upload File"/>
</form>

<div id="result">call back result will appear here</div>

</body>
</html>

and my php 'post.php'

和我的 php 'post.php'

<?php
  echo $file['tmp_name'];
?>

Uploaded File name is not returned back. Issue is i couldn't access the uploaded file.

不返回上传的文件名。问题是我无法访问上传的文件。

Thanks in advance! Shiv

提前致谢!湿婆

回答by Darin Dimitrov

Basically i want to upload a file using jQuery

基本上我想使用 jQuery 上传文件

You cannot upload files using AJAX. You could use the jquery.formplugin which uses a hidden iframe:

您不能使用 AJAX 上传文件。您可以使用使用隐藏 iframe的jquery.form插件:

<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="http://malsup.github.com/jquery.form.js"></script>
    <script type="text/javascript">
        $(document).ready(function(event) {
            $('#form1').ajaxForm(function(data) {
                $('#result').html(data);
            });
        });
  </script>  
</head>
<body>
<form id="form1" action="post.php" method="post" enctype="multipart/form-data">
    <h3>Please input the XML:</h3>
    <input id="file" type="file" name="file" /><br/>
    <input id="submit" type="submit" value="Upload File"/>
</form>

<div id="result">call back result will appear here</div>

</body>
</html>

Also notice the enctype="multipart/form-data"on the form.

还要注意enctype="multipart/form-data"表格上的。

Another possibility is to use the HTML5 File APIwhich allows you to achieve that assuming the client browser supports it.

另一种可能性是使用HTML5 文件 API,假设客户端浏览器支持它,它允许您实现这一目标。

回答by Buzut

It's not possible to upload files with jQuery $.post, neverthless, with the file API and XMLHttpRequest, it's perfectly possible to upload a file in AJAX, and you can even know how much data have been uploaded yet…

用jQuery $.post 上传文件是不可能的,但是,有了文件API 和XMLHttpRequest,完全可以用AJAX 上传文件,你甚至可以知道已经上传了多少数据……

$('input').change(function() 
{
    var fileInput = document.querySelector('#file');

    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/upload/');

    xhr.upload.onprogress = function(e) 
    {
        /* 
        * values that indicate the progression
        * e.loaded
        * e.total
        */
    };

    xhr.onload = function()
    {
        alert('upload complete');
    };

    // upload success
    if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0))
    {
        // if your server sends a message on upload sucess, 
        // get it with xhr.responseText
        alert(xhr.responseText);
    }

    var form = new FormData();
    form.append('title', this.files[0].name);
    form.append('pict', fileInput.files[0]);

    xhr.send(form);
}

回答by odiszapc

No no no, you should use a jQuery form plugin for async uploading files. You can't upload file with jQuery $.post method. The file will be uploaded with hidden iframe

不不不,您应该使用 jQuery 表单插件来异步上传文件。你不能用 jQuery $.post 方法上传文件。该文件将使用隐藏的 iframe 上传

Another way is to use HTML5 uploading with FileAPI/BlobApi

另一种方法是使用带有 FileAPI/BlobApi 的 HTML5 上传

回答by aary trivedi

Your upload.php has some error.

您的 upload.php 有一些错误。

you should change your this part.

你应该改变你的这部分。

echo $file['tmp_name'];

to:-

到:-

echo $_FILES['file']['tmp_name'];

回答by aary trivedi

Try uploading with an iframe because you can't send a file with $.post method.

尝试使用 iframe 上传,因为您无法使用 $.post 方法发送文件。

回答by norbi771

You could also try jquery uploadify - http://www.uploadify.com/

您也可以尝试 jquery uploadify - http://www.uploadify.com/