Javascript - 代码不能正常工作

-2

我正在尝试创建与http://drag-2-share.appspot.com类似的新网页。我复制了源代码并在本地进行了测试，以了解更多关于他们如何开发它的内容，但是当我保存到本地时，它并未按照网页进行工作。据我所知，它应该保存在列表中。我从来没有做过JavaScript，所以如果有人可以帮助我。以下是代码，您可以保存在本地并进行测试。Javascript - 代码不能正常工作

代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 

<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<title>Drag2Share</title> 
</head> 
<body> 
    <div id="drop_zone"> 
    <select id="fileSelect"></select> 
    <button onclick="handleView();">View</button> 
    <button onclick="handleDownload();">Download</button> 
    <button onclick="updateSelector();">Update</button> 
    <table> 
     <tr> 
     <td id="drop_text">Drop File(s) Here</td> 
     </tr> 
    </table> 
    </div> 
</body> 
<script type="text/javascript"> 
    function handleFileSelect(evt) { 
     evt.stopPropagation(); 
     evt.preventDefault(); 
     var files = evt.dataTransfer.files; // FileList object 
     var finished; 
     for (var i = 0, file; file = files[i]; i++) { 
      var request = new XMLHttpRequest(); 
      request.open('POST', '/files/' + file.name); 
      request.onreadystatechange = function() { 
       if (!files[i + 1] && !finished) { 
        window.alert("Upload Completed"); 
        finished = true; 
        updateSelector(); 
       } 
      } 
      request.send(file); 
     } 
     document.getElementById('drop_zone').className = ""; 
    } 

    function handleDragOver(evt) { 
     evt.stopPropagation(); 
     evt.preventDefault(); 
     document.getElementById('drop_zone').className = "over"; 
    } 

    function handleLeave(evt) { 
     evt.stopPropagation(); 
     evt.preventDefault(); 
     document.getElementById('drop_zone').className = ""; 
    } 

    function handleView() { 
     var select = document.getElementById("fileSelect"); 
     window.open("files/" + select.options[select.selectedIndex].value); 
    } 

    function handleDownload() { 
     var select = document.getElementById("fileSelect"); 
     window.location += "files/" 
       + select.options[select.selectedIndex].value + "?download"; 
    } 

    function updateSelector() { 
     var select = document.getElementById("fileSelect"); 
     while (select.options.length > 0) { 
      select.remove(0); 
     } 
     var request = new XMLHttpRequest(); 
     request.open('GET', '/info', false); 
     request.send(null); 
     var json = eval(request.responseText); 
     for (var i = 0; i < json.length; i++) 
      AddSelectOption(select, json[i], json[i], true); 
     select.selectedIndex = 0; 
    } 

    function AddSelectOption(selectObj, text, value, isSelected) { 
     if (selectObj != null && selectObj.options != null) 
      selectObj.options[selectObj.options.length] = new Option(text, 
        value, false, isSelected); 
    } 

    // Setup the dnd listeners. 
    var dropZone = document.getElementById('drop_zone'); 
    dropZone.addEventListener('dragover', handleDragOver, false); 
    dropZone.addEventListener('dragleave', handleLeave, false); 
    dropZone.addEventListener('drop', handleFileSelect, false); 

    // Initialize file selector 
    updateSelector(); 
</script> 
<style type="text/css"> 
#drop_zone { 
    width: 100%; 
    height: 100%; 
} 

#drop_zone.over { 
    background: gray; 
} 

#drop_text { 
    text-align: center; 
    vertical-align: middle; 
} 

html,body,table { 
    width: 100%; 
    height: 100%; 
    padding: 0; 
    margin: 0; 
    overflow: hidden; 
} 
</style> 
</html>

来源

2012-03-01 chinna_82

请更详细的定义“没有工作”。 – deceze 2012-03-01 09:25:30

如果你以前从未使用Javascript，我可以建议从一些简单的脚本开始，并从那里开始工作吗？盲目复制其他人的代码，然后来到这里问为什么它不起作用是不是要走的路。 – 2012-03-01 09:27:04

当我拖入文件...弹出窗口的作品，但我不知道文件去了哪里。 – 2012-03-01 09:28:05