从 Jquery ajax 发布二进制代码不起作用

Question

我编写了这段代码来制作图片上传功能，但变量没有被 ajax 发布，请帮助我！ jQuery()

<script type="text/JavaScript">
$(document).ready(function() {
    $("#btn").click(function() {
    $.get("i.png", function(response) {


 var img = response;
}); 

$.ajax({
    type: "POST",
    url: 'lol.php',
    data: {r: img},
    success: function(data){
        $("#ol").html(data)

    }

});
return false;
});
});

</script>

PHP 代码

<?php
$conn = mysqli_connect("localhost","root","","image");
$r = $_POST['r'];
echo $r;

?>

Answer 1

如果您只想进行图片上传（而不是完全匹配“二进制上传”）

我建议您使用正确的函数式和原生输入类型文件。

在 html 表单中，输入：

<input type="file" id="upload">
<img src="blank.png" title="upload-preview">

还有你的 javascript：

这将加载所选的预览缩略图

fileInput.addEventListener("change", function(event)
{
    var file = $("#upload")[0].files[0];
    $(".upload-preview").attr('src', window.URL.createObjectURL(file));
});

当您单击按钮时，将发送图像

带有 “multipart/form-data” 内容类型

$("#btn").on("click", function()
{
    var inputs = new FormData();
    inputs.append("upload", $("#upload")[0].files[0]);

    $.ajax
    ({
        url:"your.php",
        type:"POST",
        data: inputs,
        cache: false, // don't cache the image
        processData: false, // Don't process the files
        contentType: false,
        success: function(response)
        {
            // next instructions
        }
    });
});