打开TXT文件并显示

最新推荐文章于 2024-10-24 09:02:20 发布

weixin_30295091

最新推荐文章于 2024-10-24 09:02:20 发布

阅读量161

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/zj19940610/p/5099011.html

本文介绍了一种在不同浏览器环境下实现文件读取和解析的方法，包括Chrome、IE、Firefox等。利用JavaScript实现了对TXT文件的读取，并将文件内容显示在页面上。

<!DOCTYPE html>
<html>
<head>
    <title></title>  
    <script>
        function upload(input){
            //支持chrome IE10
            if (window.FileReader){
                var file = input.files[0];
                filename = file.name.split(".")[0];
                var reader = new FileReader();
                reader.onload = function (){
                    debugger;
                    console.log(this.result)
                    document.getElementById("ar1").value = this.result;
                }
                reader.readAsText(file,"utf-8"); //编码格式 
            }
                //支持IE 7 8 9 10
            else if (typeof window.ActiveXObject != 'undefined'){
                var xmlDoc;
                xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
                xmlDoc.async = false;
                xmlDoc.load(input.value);
                document.getElementById("ar1").value = xmlDoc.xml;
            }
                //支持FF
            else if (document.implementation && document.implementation.createDocument){
                var xmlDoc;
                xmlDoc = document.implementation.createDocument("", "", null);
                xmlDoc.async = false;
                xmlDoc.load(input.value);
                document.getElementById("ar1").value = xmlDoc.xml;
            } else{
                alert('error');
            }         
        }
    </script>

</head>
<body>
    <input type="file" value="打开TXT文件" onchange="upload(this)" />
    <textarea name="ar1" id="ar1" cols="100" rows="20"></textarea>
</body>
</html>