Question

我需要在我的网站上添加拖放功能，以允许上传所有类型的文件（pdf，jpg，txt等）。

并且我需要一个函数将此文件存储在特定目录中。

我已经在网上找到了此代码，但是它仅允许上传图像（jpg，png等）。

var fileobj;
	function upload_file(e) {
		e.preventDefault();
		fileobj = e.dataTransfer.files[0];
		ajax_file_upload(fileobj);
	}

	function file_explorer() {
		document.getElementById('selectfile').click();
		document.getElementById('selectfile').onchange = function() {
		    fileobj = document.getElementById('selectfile').files[0];
			ajax_file_upload(fileobj);
		};
	}

	function ajax_file_upload(file_obj) {
		if(file_obj != undefined) {
		    var form_data = new FormData();                  
		    form_data.append('file', file_obj);
			$.ajax({
				type: 'POST',
				url: 'ajax.php',
				contentType: false,
				processData: false,
				data: form_data,
				success:function(response) {
					alert(response);
					$('#selectfile').val('');
				}
			});
		}
	}

#drop_file_zone {
        background-color: #EEE;
        border: #999 5px dashed;
        width: 290px;
        height: 200px;
        padding: 8px;
        font-size: 18px;
    }

    #drag_upload_file {
        width:50%;
        margin:0 auto;
    }

    #drag_upload_file p {
        text-align: center;
    }

    #drag_upload_file #selectfile {
        display: none;
    }

<html>
<head>
  <meta charset="utf-8">
  <meta name="generator" content="AlterVista - Editor HTML"/>
  <title></title>
</head>
<body>
<div id="drop_file_zone" ondrop="upload_file(event)" ondragover="return false">

    <div id="drag_upload_file">

        <p>Drop file here</p>

        <p>or</p>

        <p><input type="button" value="Select File" onclick="file_explorer();"></p>

        <input type="file" id="selectfile">

    </div>

</div>


</body>
</html>

<?php 
$arr_file_types = ['image/png', 'image/gif', 'image/jpg','image/jpeg']; if (!(in_array($_FILES['file']['type'], $arr_file_types))) { echo "false"; return; }

if (!file_exists('uploads')) { mkdir('uploads', 0777); }

move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . time() . $_FILES['file']['name']);

echo "File uploaded successfully."; 
?>

如何修复它以确保它允许上传所有类型的文件？

我已经尝试在$arr_file_types=['document/pdf']处添加。如果有人已经有一个工作脚本，它将对我有帮助。

非常感谢您。

Answer 1

我设法进行了一些修改以使之工作

更改html输入可接受的文件

div

并更改ajax文件

<input type="file" id="selectfile" accept="application/pdf">

拖放webApp上的所有文件类型

1 个答案: