pdf文件上传ajax html

IT技术 javascript php jquery ajax pdf
2021-03-04 20:17:52 
    var file = $('#image').prop('files')[0];
    var filename = $('#af_rpta_propertyland_filename').val();

    var form_data = new FormData();
    form_data.append('file', file);
    alert(form_data);


    $.ajax({
        type: 'POST',
        url: '../include/upload.php',
        //dataType: "json",
        data: {
            file: form_data,
            filename: filename
        },
        success: function(data) {
            console.log(data);
            for (var i = 0; i < data.length; i++) {
                console.log("file " + i + ": " + data[i].file);
            }

        },
        error: function(data) {
            alert('No Record Found: ' + data);
        }


    });

<input id="image" name="image" type="file" />

这是我如何在我的 php 代码中使用 ajax 上传我的 pdf 文件我这样做

$file = mysql_real_escape_string($_POST['file']);
$filename = mysql_real_escape_string($_POST['filename']);
    if (isset($_FILES['file']) && $_FILES['file']['size'] > 0) { 
                $tmpName  = $_FILES['file']['tmp_name'];  
                $filetype = $_FILES['file']['type'];
                $fp = fopen($tmpName, 'rb'); // read binary
    $upload[] = array('filename' => $filename,'file' => $fp);

    }

echo json_encode($upload, JSON_UNESCAPED_UNICODE);

从我input(type file)如何将它value(the pdf file)放入data(in ajax)和从我如何data(ajax)将它传递给 php 文件，以便我可以检查它$_files是否不为空

2个回答

尝试json从files[0]属性创建一个对象，转换file为base64字符串

js

$("#image").on("change", function(e) {
  var name = $("#af_rpta_propertyland_filename").val()
  , file = e.target.files[0]
  , filename = name.length > 1 ? name + ".pdf" : file.name
  , filetype = file.type
  , filesize = file.size
  , data = {
      "filename":filename,
      "filetype":filetype,
      "filesize":filesize
    }
  , reader = new FileReader();
    reader.onload = function(e) {
      data.file_base64 = e.target.result.split(/,/)[1];
        $.post("fileupload.php", {file:data}, "json")
        .then(function(data) {
          // parse `json` string `data`
          var filedata = JSON.parse(data)
          // do stuff with `data` (`file`) object
          , results = $("<a />", {
                "href": "data:" + filedata.filetype 
                        + ";base64," + filedata.file_base64,
                "download": filedata.filename,
                "target": "_blank",
                "text": filedata.filename
              });
          $("body").append("<br>download:", results[0]);
        }, function(jqxhr, textStatus, errorThrown) {
          console.log(textStatus, errorThrown)
        })
    };
    reader.readAsDataURL(file)
});

php 

<?php
  if (isset($_POST["file"])) {
    // do php stuff
    // call `json_encode` on `file` object
    $file = json_encode($_POST["file"]);
    // return `file` as `json` string
    echo $file;
};

jsfiddle http://jsfiddle.net/guest271314/LL95z474/

而不是$("#image").on("change", function(e) {我想点击按钮，我想改变它，但我在功能（e）中有错误，file = e.target.files[0]我像这样尝试过，$('idofinput').files[0]但我不知道在哪里出错。当我在 php 中发布数据时，我可以$_POST["file"]在 php 文件中检索它吗？
2021-04-19 20:17:52
Cannot read property '0' of undefined当我改变为时var file = e.target.files[0];，我总是得到var file = $('#image').files[0];
2021-04-24 20:17:52
我无法理解我复制粘贴代码的代码，但我仍然收到错误“ localhost/echo/json 404（未找到）”以及如何使其从按钮单击开始？
2021-04-28 20:17:52
我已经看过小提琴并且它正在工作，虽然这对我来说有点复杂，但我会研究它并希望我能理解它，如果我有问题，请告诉我。
2021-05-01 20:17:52
在 name.length > 1 ? name + ".pdf" : file.name 如果我希望我的代码灵活，我可以将 ".pdf" 更改为 file.type 吗？还有一件事 $file 将是我将保存在数据库中的那个？以及如何把动作放在按钮点击上？
2021-05-07 20:17:52

使用 jQuery 版本“jquery-1.10.2.min.js”

使用这个 AJAX

$.ajax({
        url: "YourPage.php", 
        type: "POST",             
        data: new FormData('YourFormId'), 
        contentType: false,                  
        processData:false,        
        success: function(data)   
        {
            // Do your Stuff
        }
    });

在 PHP 页面上只需简单地使用这一行

$name = $_FILES['file']['name'];

在这段代码中，我使用了两个新事件

  1. 内容类型
  2. 处理数据

这对于使用这些上传和访问 AJAX 中的所有数据是必要的。

希望这会帮助你。

new FormData('YourFormId') 也很重要
2021-04-23 20:17:52
其它你可能感兴趣的问题
上一篇获取 ES6 Symbol 的描述 下一篇为什么在函数调用中捕获对象的值？