Edit in JSFiddle

var drop = document.getElementById("dropArea");

//
drop.addEventListener("drop", function(event) {
    drop.style.backgroundColor = "#ccc";
    //
    var filelist = event.dataTransfer.files;
    for (var i = 0; filelist.length; i++) {
          
        if (window.FileReader && (filelist[i].type == "text/plain")) {
            var reader = new FileReader();
            reader.readAsText(filelist[i]);
            reader.onload = function(event) {
                drop.innerHTML = event.target.result;
            }

        }
    }

}, true);
//
drop.addEventListener("dragenter", function(event) {
    event.preventDefault();
    drop.style.backgroundColor = "#ecc";
}, true);
//
drop.addEventListener("dragleave", function(event) {
    event.preventDefault();
    drop.style.backgroundColor = "#ccc";
}, true);

//
drop.addEventListener("dragover", function(event) {
    event.preventDefault();
}, true);
//
window.addEventListener("drop", function(event) {
    event.preventDefault();
}, true);
//
window.addEventListener("dragenter", function(event) {
    event.preventDefault();
}, true);
//
window.addEventListener("dragleave", function(event) {
    event.preventDefault();
}, true);
//
window.addEventListener("dragover", function(event) {
    event.preventDefault();
}, true);
<div id="dropArea"></div>
div#dropArea{
    width:400px;
    height:300px;
    background-color:#ccc;
}