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