如何在Mac上运行dropzone drag n drop

时间:2019-05-22 14:41:11

标签: php jquery file-upload dropzone.js dropzone

我已经使用放置区域框架实现了Drag n放置形式

在测试此拖曳n的过程中,我发现它在使用chrome的Windows系统上运行良好

但是当我使用Safari浏览器在Mac上进行测试时,文件被拖动了,但从未将其上传到我的文档目录中。

我正在使用jquery单击提交按钮来上传我的文件。

下面是我的实现

JQUERY

<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/dropzone.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/dropzone-amd-module.js"></script>
<script>
//Disabling autoDiscover
Dropzone.autoDiscover = false;

$(function() {
    //Dropzone class
    var myDropzone = new Dropzone(".dropzone", {
        url: "upload.php",
        paramName: "file",
        maxFilesize: 20,
        maxFiles: 10,
        addRemoveLinks: true,
        acceptedFiles: ".jpg,.JPG.jpeg,.JPEG,.PNG,.png,.gif",
        autoProcessQueue: false
    });

    $('#startUpload').click(function(){           
        myDropzone.processQueue();
    });
});
</script>

HTML DIV N CSS

<link rel="stylesheet" href="drop.css">



      <div class="dropzone"></div>

PHP

<?php
include_once("data.php");

if(!empty($_FILES)){
$upload_dir = "files/";
$fileName = $_FILES['file']['name'];


 $newfilename = (rand(100000,1000000000)).$row_ux['Username'];
  $ext = pathinfo($fileName, PATHINFO_EXTENSION);
  $dot = '.';

if(move_uploaded_file($_FILES['file']['tmp_name'],'files/'.$newfilename.$dot.$ext)){
  $er = $last_id - 1;
//insert file information into db table

$mysql_insert = "INSERT INTO documents (`file`,adsid)VALUES('".'files/'.$newfilename.$dot.$ext."','".$er."')";

mysqli_query($conn, $mysql_insert) or die("database error:". mysqli_error($conn));

}
}

?>

请问在使用dropzone的Mac系统上上传的问题可能是什么?任何人都遇到这个吗?

1 个答案:

答案 0 :(得分:0)

这是我到目前为止所拥有的,应该让您入门,看看如何使用它,并让我知道,在需要时删除dropzone-amd-module.js吗?

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/dropzone.js"></script>

</head>


<div class="dropzone"></div>
<button id="startUpload">Upload</button>

<script>
    Dropzone.autoDiscover = false;

    $(document).ready(function () {
        var myDropzone = new Dropzone(".dropzone", {
            init: function () {

                $('#startUpload').click(function () {
                    myDropzone.processQueue();
                });
            },
            url: "upload.php",
            type: 'POST',
            autoProcessQueue: false,
            success: function () {
                //do stuff
            },
            error: function () {
                //do error notification
            }


        });
    });
</script>