从HTML页面上传文件时出现问题

时间:2018-11-16 15:35:06

标签: javascript html file-upload drag-and-drop

很久以前,我在堆栈上发布了一个问题,在该问题中,我需要在我的项目中必须放置的拖放区域方面寻求帮助.. 现在,我在这里问你为什么为什么一旦加载了任何类型的文件后都不允许我打开后者,从而给我这个错误:

enter image description here

上传功能完美运行!但是它没有授予我打开上传文件的权限

下面我要附加我的脚本...

Ajax.php

<?php
/*$arr_file_types = ['image/png', 'image/gif', 'image/jpg', 'image/jpeg',"document/pdf","file/txt"];

if (!(in_array($_FILES['file']['type'], $arr_file_types))) {
	echo "false";
	return;
}*/
date_default_timezone_set('Europe/Rome');
$date = date('Y-m-d');
if (!file_exists('uploads')) {
	mkdir('uploads', 0777);
}

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

echo "File uploaded successfully.";
?>

index.php

<style>

    #drop_file_zone {

        background-color: #37bf00;

        border: #999 5px ;

        width: 150px;

        height: 150px;

        padding: 8px;

        font-size: 13px;
    }

    #drag_upload_file {

        width:50%;

        margin:0 auto;

    }

    #drag_upload_file p {

        text-align: center;

    }

    #drag_upload_file #selectfile {

        display: none;

    }
	
	.coloreTdDrop{
		background-color: #37bf00;
	}

</style>
<html>
<body>
		<div id="drop_file_zone" ondrop="upload_file(event)" style=" width: 100%; border: 1px dashed black;" ondragover="return false">	
			<div id="drag_upload_file" >
				<p>CARICA FILE<p/>
				<input type="file" id="selectfile">
			</div>
		<input type="button" value="Seleziona File"  class="btn btn-success" onclick="file_explorer();">
		</div>
</body>
</html>	 
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
	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('');
				}
			});
		}
	}
</script>

编辑:当我尝试向用户添加权限时发生……Second Error

0 个答案:

没有答案