禁用文本的拖放

Question

我正在为图像文件开发一个拖放系统，我注意到dragenter 事件也会在选定的文本拖动时执行。

$(document).on("dragenter", "#element", function(event){
    event.preventDefault();

    // Check if we are dragging text

    if(is_text){ // <- HERE
        console.log("dragging text!");
    }else{
        console.log("dragging file!");
    }
});

我想检测拖动的对象不是文本，所以之前的console.log如果是就不会运行。

更新和解决方案：

var dragging_text = false;

$(window).on("dragstart", function(event){
    dragging_text = true;
    console.log("dragstart");
});

$(document).on("dragenter", "#element", function(event){
    event.preventDefault();

    if(dragging_text){
        console.log("NO, dragging text!");
    }else{
        console.log("OK, dragging file!");
    }
});

Answer 1

这将帮助您了解：

 var dragging_text = false;

$(window).on("dragstart", function(event){
    dragging_text = true;
    console.log("dragstart");
});

$(document).on("dragenter", "#element", function(event){
    event.preventDefault();

    if(dragging_text){
        console.log("NO, dragging text!");
    }else{
        console.log("OK, dragging file!");
    }
    dragging_text = false;
});

Answer 2

您需要查看DataTransfer

$(document).on("dragenter", "#element", function(event){   
    if(event.dataTransfer.files.length > 0){ // <- HERE
        console.log("dragenter");
    }else {
        event.preventDefault();
    }
});