javascript - 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 (您可以通过在加载后尝试将文件拖入网站来重新创建，然后输入“cls”或“clear”，然后尝试再次拖入文件)

Answer 1

$("#container").html(""); 销毁 #fileupload 表单(因为它是 #container 的子表单>)