`
ipython
  • 浏览: 294535 次
  • 性别: Icon_minigender_1
  • 来自: 佛山
社区版块
存档分类
最新评论

javascript 读取本地文件

    博客分类:
  • web
阅读更多

利用html5读取本地的文件,此方法在chrome和firefox有效,利用是的FileReader.

<!DOCTYPE>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <title>read local file</title>
</head>
<body>
    <h3>read local file with html5</h3>
    <p>考参 : http://www.jsmix.com/html5/file-reader.html</p>
    <p>使用 : 在chrome测试通过,其他浏览器没测试;直接双击打开显示错误的,把它放在一个web server的目录中,通过服务器的路径,如: http://127.0.0.1/a.html 打开<p>
    <input type="file" id="f1" onchange="xx();">
    <hr>
    <div id="content"></div>
    <script>
        function xx (){
            var dd = document.getElementById('content');
            var reader = new FileReader();
            if (typeof (FileReader) == "undefined"){
                dd.innerHTML = "your browser doesn't support filereader";
                return;
            }
            var file = document.getElementById('f1').files[0];
            reader.onload = function (e){
                dd.innerHTML += this.result;
            }
            reader.onerror = function (e){
                dd.innerHTML = "error<br>";
            }
            reader.readAsText(file);
        }
    </script>
</body>
</html>
 
分享到:
评论
1 楼 greatghoul 2012-02-20  
FileReader在chrome以下,需要在服务器端才能运行..
真不爽呀。

相关推荐

    javascript读取本地文件和目录方法详解

    那就请跟我来,本文将详细描述如何使用Javascript语言进行文件操作。 一、功能实现核心:FileSystemObject 对象 其实,要在Javascript中实现文件操作功能,主要就是依靠FileSystemobject对象。在详细介绍...

    js读写本地文件js读写本地文件

    ### JavaScript 读写本地文件详解 #### 一、概述 在Web开发中,JavaScript作为一种广泛使用的客户端脚本语言,主要用于实现网页的动态效果与交互功能。然而,由于浏览器的安全限制,默认情况下JavaScript是无法...

    js读取本地文件到字节数组

    本文将详细介绍如何使用JavaScript来读取本地文件并将其转换为字节数组。 #### 基本原理 在现代浏览器中,`FileReader` API 提供了读取文件的能力。它支持多种格式的数据读取,其中一种就是将文件内容读取为字节...

    JavaScript读取本地文件常用方法流程解析

    JavaScript 读取本地文件的能力是受限的,但通过HTML5引入的`&lt;input type="file"&gt;`元素和`FileReader`API,我们可以实现文件的选取和读取。这些功能为Web应用程序提供了与用户设备上文件交互的基础,同时遵循了安全...

    JavaScript 操作本地文件

    FileReader是JavaScript操作本地文件的核心工具,它提供了异步读取文件的方法。主要有以下方法: - `readAsText(file, encoding)`: 将文件内容读取为文本,可以指定编码。 - `readAsDataURL(file)`: 读取文件为...

    unigui_ajax读取本地文件信息

    总的来说,"unigui_ajax读取本地文件信息"涉及的关键知识点包括:Unigui框架的使用、Ajax技术、JavaScript的FileReader API、客户端与服务器的异步通信、文件上传的安全处理以及后台服务端的文件处理逻辑。...

    javascript处理本地文件的资料

    虽然JavaScript在客户端直接读写本地文件受到限制,但通过File API、Blob、ArrayBuffer、FileSystem API、Web Workers等技术,开发者仍然能够有效地处理和操作本地文件。在服务器端,Node.js提供了一整套强大的工具...

    js读取本地文件

    在给定的示例代码中,通过使用一个隐藏的`&lt;object&gt;`标签并结合JavaScript函数,实现了选择、读取以及保存本地文件的功能。下面将逐一分析这些关键部分: ##### 2.1 使用`&lt;object&gt;`标签创建ActiveX控件 ```html ...

    JQuery实现本地文件的读取、文件内容的复制

    本文将深入探讨如何使用jQuery实现本地文件的读取和文件内容的复制,这对于网页应用中的数据导入、导出或者用户交互功能非常重要。 首先,我们需要明白jQuery本身并不直接支持文件系统的操作,因为它主要是为浏览器...

    通过Javascript读取本地Excel文件内容的代码示例

    3. **JavaScript读取本地文件的安全问题**: - 默认情况下,浏览器出于安全考虑,不会给予ActiveX控件执行权限。 - 解决方案包括修改浏览器的安全设置,如将网站加入到可信站点列表,并且在“自定义级别”中调整...

    使用JavaScript实现一个本地文件选择器功能

    在JavaScript中实现一个本地文件选择器功能,是前端开发中常见的需求,这通常涉及到HTML5的File API。这个功能允许用户从他们的计算机上选择文件,并且可以进行预览、上传或者其他处理。以下将详细讲解如何实现这个...

    js使用FSO读取本地文件信息

    JS 使用 FSO 读取本地文件信息是指使用 JavaScript 语言通过 FSO(FileSystemObject)读取本地文件信息的方法。FSO 是一个 ActiveX 对象,提供了文件系统操作的接口。通过使用 FSO,可以读取本地文件和目录信息。 ...

    Javascript写入和读取txt文件

    然而,在某些特定环境下,比如使用IE浏览器时,可以通过ActiveX对象实现对本地文件系统的操作。本文将详细介绍如何利用JavaScript中的`FileSystemObject`来实现TXT文件的写入和读取功能。 #### 二、JavaScript写入...

    最新的vue读取本地json文件代码

    在生产环境中,通常需要后端API来提供数据,而不是直接读取本地文件。这是因为浏览器的安全策略限制了JavaScript对本地文件的访问。 总的来说,Vue通过结合`axios`库,可以方便地从本地JSON文件加载数据。确保JSON...

    Electron项目:读写本地json文件,实现用户登录、修改用户信息,窗口最小化,最大化,关闭窗口

    Node.js的`fs`模块提供了读写文件的能力,例如`fs.readFile()`和`fs.writeFile()`,可以用来读取和保存JSON数据到本地文件。 3. **用户登录**: 用户尝试登录时,通常会提供用户名和密码。在正常情况下,这些信息...

    JavaScript操作本地文件.doc

    JavaScript操作本地文件的能力是Web开发中的一个重要进展,特别是在现代浏览器如Chrome、IE和Firefox中,JavaScript引擎的性能提升使得更多的复杂任务得以实现。W3C正在考虑的一个草案就是JavaScript直接操作本地...

    Javascript 读取Excel实例

    在JavaScript中,由于浏览器的安全策略,直接读取本地文件是受限的,这主要是为了防止恶意代码访问用户硬盘上的数据。然而,在某些特定情况下,如在客户端处理用户上传的Excel文件,我们可能需要实现JavaScript读取...

    Springboot读取本地json文件工程

    3. **使用Spring的Resource和InputStream**:Spring框架提供了`Resource`接口,可以方便地操作各种类型的资源,包括本地文件。你可以使用`ClassPathResource`读取类路径下的JSON文件: ```java Resource resource ...

Global site tag (gtag.js) - Google Analytics