使用javascript從文本文件讀取值

Question

• 我的本地計算機上有一個文本文件。
• 而且我在jsp頁面中有一個按鈕。
• 在單擊按鈕時，我需要獲取文本文件的內容。
• 並且該文件具有n個內容。

誰能給我JavaScript函數來實現這一目標。

Answer 1

您應該在問題中指定要讀取客戶端文件，因為我看到很多內容都涉及服務器端讀取。

您應該看一下FileAPI-一種HTML 5 Javascript附加功能，它允許JavaScript通過文件輸入讀取文件內容。

我正在為您編寫代碼示例-但是您應該閱讀這里是一個不錯的網站

http://www.htmlgoodies.com/beyond/javascript/read-text-files-using-the-javascript-filereader.html#fbid=4Fhi9T4mEAA

如果沒有FileAPI，您仍然可以使用帶有target =“ some iframe”形式的文件輸入字段-然后讓服務器上傳文件並返回文本。 （FormData允許在Ajax中上傳文件，但並非所有瀏覽器都支持它）。

因此，File API是您的理想之路以下是使用File API的方法

<input type="file"/>
<script>
$(function(){
            $("input").change(function(e){
                    console.log(["file changed",e]);
                var myFile = e.target.files[0];
                var reader = new FileReader();
                reader.onload = function(e){
                    console.log(["this is the contents of the file",e.target.result]);
                };
                reader.readAsText(myFile)

            });
        }
)
</script>

您還可以實現拖放界面（例如google gmail has）

        $("div").on("dragover",function(e){
            e.dataTransfer = e.originalEvent.dataTransfer;
                e.stopPropagation();
                e.preventDefault();
                e.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy.

        }).on("drop",function(e){
                    e.dataTransfer = e.originalEvent.dataTransfer;
                    e.stopPropagation();
                    e.preventDefault();
                    console.log(["selected files", e.dataTransfer.files])});