gpt4 book ai didi

php - 没有 AJAX 的 HTML5 拖放是可能的吗?

转载 作者:行者123 更新时间:2023-11-28 02:06:56 25 4
gpt4 key购买 nike

<分区>

我尝试制作一个没有 ajax 的 HTML5 uploader ,因为我必须创建一个带有输入名称的目录。我试着让它像正常一样工作

<input type="file" />

但是在正常上传时我无法获取 $_FILES 中的 tmp_name。我可以只使用文件的 mozFullPath 上传吗?这是我的代码,dropzone 运行良好。

<script>
var filesUploaded = new Array();

var dropZoneElement = document.getElementById("dropZone");

dropZoneElement.addEventListener('dragleave', onDragLeave, false);
dropZoneElement.addEventListener('dragenter', onDragEnter, false);
dropZoneElement.addEventListener('dragover', onDragOver, false);
dropZoneElement.addEventListener('drop', onDrop, false);

function onDragLeave(event) {
event.preventDefault();
event.stopPropagation();
//you can remove a style from the drop zone

}

function onDragEnter(event) {
event.preventDefault();
event.stopPropagation();
//you can add a style to the drop zone
}

function onDragOver(event) {
event.preventDefault();
event.stopPropagation();
event.dataTransfer.effectAllowed = "copy";
event.dataTransfer.dropEffect = "copy";
}

function onDrop(event) {
event.preventDefault();
event.stopPropagation();
console.log(event.dataTransfer);
onFilesSelected(event.dataTransfer.files);
}

function onFilesSelected(files) {
var dropZoneElement = document.getElementById("dropZone");
for (var i=0; i<files.length; i++) {
filename = files[i]['name'];
filesrc = files[i]['mozFullPath'];
filesize = files[i]['size'];
filetype = files[i]['type'];
filesUploaded[i] = filesrc;

var span = document.createElement("span");
span.setAttribute('class','fileUpload');
dropZoneElement.appendChild(span);
var reader = new FileReader();
reader.onload = function (files) {
span.innerHTML = '<i class="icon-file"></i> ' + filename;
};
reader.readAsDataURL(files[i]);
}

}
</script>

谢谢大家的建议和帮助!

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com