0
我试图实施从桌面到浏览器中的文件拖放&拖放功能，我已经有2个遇到的问题：文件拖放HTML5问题
我需要事件时，将触发在拖动过程中，当光标离开浏览器的窗口。 您可以在mail.google.com上看到此类机制 - 当用户将文件拖到其他位置时，文本“此处放置文件”消失。 我试过所有拖动事件，但他们没有帮助。
第二个问题是我需要在用户将文件拖到所有元素上时将光标设置为“none”，除了“droplabel”div。 我知道下面的代码行改变了光标，但是当光标达到'droplabel'div时如何将其更改为正常？
evt.dataTransfer.effectAllowed = 'move';
有人知道如何解决这个问题吗？
<html>
<body>
<form>
<div id="droplabel" style="width:200px;height:200px;background-color:red">Drop file here...</div>
<script>
function handleDrop(evt) {
evt.stopPropagation(); // Stops some browsers from redirecting.
evt.preventDefault();
var files = evt.dataTransfer.files;
for (var i = 0; i < files.length; i++) {
console.log(files[i].name);
}
}
function handleDragOver(evt) {
if (evt.preventDefault) {
evt.preventDefault(); // Necessary. Allows us to drop.
}
return false;
}
document.getElementById('droplabel').ondrop = handleDrop;
document.getElementById('droplabel').ondragover = handleDragOver
var body = document.getElementsByTagName('body')[0];
document.ondragover = function (evt) {
evt.preventDefault();
}
document.ondrop = function (evt) {
evt.stopPropagation(); // Stops some browsers from redirecting.
evt.preventDefault();
}
</script>
</form>
</body>
</html>