JavaScript: 在文本区域显示一个文件:

Question

我想在文本区域中显示文件的内容。我使用这个脚本来做到这一点，但是当我点击打开按钮时，文本没有出现：

   function loadFileAsText()
   {
    document.getElementById("textoNormal").scrollTop=0;
    var fileToLoad = document.getElementById("fileToLoad").files[0];

    var fileReader = new FileReader();
    fileReader.onload = function(fileLoadedEvent)
    {
        var textFromFileLoaded = fileLoadedEvent.target.result;
        document.getElementById("textoNormal").value =   textFromFileLoaded;
    };
    fileReader.readAsText(fileToLoad, "UTF-8");
    id=1;
    }

textoNormal: 是我的文本区域的id

Answer 1

我在 jQuery onClick 中调用了你的函数，它运行良好，

jquery

$(document).ready(function(){
   $('.clickMe').click(function(){
    document.getElementById("textoNormal").scrollTop = 0;
            var fileToLoad = document.getElementById("fileToLoad").files[0];
            var fileReader = new FileReader();
            fileReader.onload = function(fileLoadedEvent)
            {
            var textFromFileLoaded = fileLoadedEvent.target.result;
                    document.getElementById("textoNormal").value = textFromFileLoaded;
            };
            fileReader.readAsText(fileToLoad, "UTF-8");
     id=1;        
    }); 
});

HTML

<textarea id="textoNormal"></textarea>
<input type="file" id="fileToLoad" />

<div  class="clickMe">Click To Read Text File</div>

Answer 2

读取文件上传控件的 onChange 事件中的内容。

        function OnUpload() {
            var obj = document.getElementById("<%=FleUldLogo.ClientID%>");
            var source = obj.value;
            var file = obj.files[0];
            var textarea=$("#txtar");
            var reader = new FileReader();
            reader.onloadend = function () {
            textarea.value= reader.result;
             }
                    reader.readAsText(file);
            return true;
        }

JavaScript: 在文本区域显示一个文件:

JavaScript: displaying a file in a text area:

javascript

textarea

file