这是一个创建于 1947 天前的主题，其中的信息可能已经有所发展或是发生改变。
对前端的内容不是很了解，不知道单纯通过前端能否实现以下内容: 点击浏览器内的元素，能显示本地的文件内容，比如点击 ul 标签，显示本地的 txt 文件内容
我目前找到的资料是：
https://jsbin.com/koxuhuduro/edit?html,js,output
是可以做到点击打开文件按钮来显示本地文件内容，但能否不需要通过按钮，单纯点击 html 中的元素就能显示文件内容？
第 1 条附言 2020-06-17 21:00:59 +08:00
确实是想绕过点击按钮这一步，看来是个安全问题，纯前端是做不到了
 | 1 RingoTC 2020-06-17 17:43:24 +08:00  1 你如果静默地读取用户本地文件地内容，而不让用户通过弹窗的方式知晓然后选择要读取的文件。 那用户的信息安全就得不到保障。 |
 | 2 musi 2020-06-17 17:46:36 +08:00 那么问题来了，按钮不是 html 中的元素？ |
 | 3 xiangyuecn 2020-06-17 17:48:48 +08:00 1 能，但本质还是点击打开文件 点击任意元素，js 中手动触发 一个隐藏的 file input click()，打开浏览器的文件选择，选择文件后，把文件读出来 |
 | 4 miniwade514 2020-06-17 17:54:16 +08:00 1 我猜楼主是想绕过选文件这一步？纯前端做不到。 |
 | 5 qiayue PRO 《小 tips: 纯前端 JS 读取与解析本地文本类文件》 https://www.zhangxinxu.com/wordpress/2018/03/js-parse-text-file/ |
 | 6 renmu123 2020-06-17 18:02:45 +08:00 via Android 1 安全性考虑，不允许这样的操作 |
 | 7 faceRollingKB 2020-06-17 18:14:55 +08:00 分几个步骤： 1 、点击 html 元素，触发 input[file]标签的 click 事件，启动浏览器上传文件功能 2 、input(onchange)事件中获取用户上传的文件流 3 、使用特定的编码将文件流转化为字符串进行解析 |
 | 8 crclz 2020-06-17 23:34:32 +08:00 出于安全考虑，纯前端读取文件只能经过 input 来让用户主动选择。并且 chrome 不会给前端提供文件路径，而是提供一个假的路径，例如 C:/fakedir/real_filename.txt 。可以去 F12 试一试。 |
 | 9 MzM2ODkx 2020-06-18 00:21:17 +08:00 chooseFileSystemEntries 新 API 了解下 |
 | 10 systemcall 2020-06-18 01:14:17 +08:00 via Android 让用户选择整个驱动器试试，不清楚有没有阻碍 |
 | 11 nianyu 2020-06-18 14:52:46 +08:00 可以 但是你得先通过 input file 选中文件。而不是通过点击任意元素就能实现 |
Select Language