Javascript - 放置document.getElementById（'blahblah'）。innerHTML

我是javascript noob，並且在腳本中有關於放置document.getElementById（'blahblah'）。innerHTML語句的問題。Javascript - 放置document.getElementById（'blahblah'）。innerHTML

更具體地說，我有以下的代碼

function upload(evt) { 
if (!browserSupportFileUpload()) { 
    alert('The File APIs are not fully supported in this browser!'); 
} else { 
    var data = null; 
    var file = evt.target.files[0]; 
    var reader = new FileReader(); 
    reader.readAsText(file); 
    reader.onload = function(event) { 
     var csvData = event.target.result; 
     data = $.csv.toArrays(csvData); 
     if (data && data.length > 0) { 
     alert('Imported -' + data.length + '- rows successfully!'); 
     } else { 
     alert('No data to import!'); 
     } 
    }; 
    reader.onerror = function() { 
     alert('Unable to read ' + file.fileName); 
    }; 
    } 
}

它基本上讀一個CSV文件，CSV數據保存到一個名爲「數據」變量。

現在我的問題是，當我把document.getElementById（'blahblah'）。innterHTML = data [0] [0];在代碼結束時，它將不會執行。

它只在語句放置在reader.onload函數內的某處時執行。

是否有一個原因不會在代碼的底部執行？

來源

2016-08-12 Yon-Joon Choo

底部是你的代碼的哪一部分？你有沒有檢查控制檯的錯誤？您是否檢查過數據以確保它是一個多維數組？您是否檢查過您的特定元素是否存在該ID？ – scrappedcola

@scrappedcola是的，只要將變量數據放置在reader.onload語句中的某處，變量數據就可以正常運行。通過「代碼底部」，我的意思是位於諸如reader.onerror之下，或者位於最後一個大括號之後的最後。 –

您的閱讀器異步執行。在加載事件觸發之前，'data'不會被定義，並且在加載或錯誤處理程序的定義之後代碼執行之前沒有任何說明它會觸發。 – scrappedcola

是的，原因是整個腳本在瀏覽器到達時被執行。因此，瀏覽器會看到您的腳本，然後嘗試執行document.getElementById('blahblah').innterHTML = data[0][0];，但data尚未上傳。如果您將它放在onload中，瀏覽器只有在上傳data時才知道執行此功能。

來源

2016-08-12 13:55:20

嗨喬納斯，所以我得到它必須放置在reader.onload後面的某處，因爲顯然直到那一點data = null。但是之後我應該不能在其他地方查詢「數據」變量？例如之後的功能，在之前？ –

否，因爲腳本不停止等待「數據」加載。它只是繼續，即使它還沒有定義，但它看到一個「onload」函數，因此它知道「我將不得不回到這裏，並在加載這個東西時做些事情」。 –

Javascript - 放置document.getElementById（'blahblah'）。innerHTML

回答

相關問題