JavaScript:在文本区域中显示文件:

JavaScript: displaying a file in a text area:

本文关键字:显示文件 区域 文本 JavaScript      更新时间:2024-02-19

我想在文本区域中显示文件的内容。我用这个脚本来做这件事,但当我点击打开按钮时,文本不会出现:

   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

在文件上传控制的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;
        }

我在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>