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>