Document.on.dragover는 관련없는 코드로 인해 깨졌습니다.

Question

내 javascript 파일은 here입니다. 기본적으로 내 웹 사이트는 파일 올리기와 같은 특정 기능을 수행하는 명령을 입력하는 명령 프롬프트 스타일 웹 사이트의 일종입니다.

$(document).on('dragover', 'body', function(e) { 
 
    e.preventDefault(); 
 
    $("#fileupload").addClass('ishovered'); 
 
    $(".dragtext").show(); 
 
}); 
 
$(document).on('dragleave', 'body', function(e) { 
 
    $("#fileupload").removeClass('ishovered'); 
 
    $(".dragtext").hide(); 
 
}); 
 
$(document).on('drop', 'body', function(e) { 
 
    $("#fileupload").removeClass('ishovered'); 
 
    $(".dragtext").hide(); 
 
});

지금이 웹 사이트로드에 잘 작동 : 나는이처럼 보이는 "드래그 & 드롭"업로드 기능을 가지고있다. 하지만이 관련이 없어 보이는 코드를 실행 한 후 : 그 후 마우스 커서를 올려 확인한 된 파일에 응답하지 않는 웹 사이트에서와 같이이 코드를 실행하는 몇 가지 이유를 들어

[...] 
 
} else if (value.match("^clear") || value.match("^cls")) { 
 
    if ($(".isup").attr("value") == "tr") { 
 
     $("#container").append("<span class='code'>" + value + "</span><span class='cmd-cont'>error: please answer yes/no first</span>"); 
 
     updateScroll(); 
 
    } else { 
 
     $("#container").html(""); /* This is what usually runs, and for some reason breaks the drag & drop upload */ 
 
    } 
 
} 
 
[...] 
 
function updateScroll() { 
 
    var element = document.getElementById("container"); 
 
    element.scrollTop = element.scrollHeight; 
 
}

는, 드래그 & 드롭 업로드를 나누기를 코드가 실행되었습니다.

Live demo

Answer 1

$("#container").html("");가 #fileupload 양식을 파괴 (당신은 다시에서 파일을 드래그하려고 다음 "분명히" "CLS"또는 입력하고, 풀로드 후 웹 사이트에 파일을 시도하여 다시 만들 수 있습니다) (왜냐하면 그것은 # container의 자식이기 때문입니다)