您可以使用
<input type="file">与
multiple属性集,
accept属性设置为
text/plain;
change事件;
FileReader,
for循环。
var pre = document.querySelector("pre");document.querySelector("input[type=file]").addEventListener("change", function(event) { var files = event.target.files; for (var i = 0; i < files.length; i++) { (function(file) { var reader = new FileReader(); reader.addEventListener("load", function(e) { pre.textContent += "n" + e.target.result; }); reader.readAsText(file) }(files[i])) }})<input type="file" accept="text/plain" multiple /><pre></pre>您还可以使用
webkitdirectory和
allowdirs属性在chrome,chrome上进行目录上传;在
dom.input.dirpicker偏好设置为每晚45+或firefox42+的情况下
true,选择和删除文件和/或要解析的文件夹。注意,您也可以从文件管理器中的
<inputtype="file">元素删除文件夹
var pre = document.querySelector("pre");document.querySelector("input[type=file]") .addEventListener("change", function(event) { console.log(event.target.files) var uploadFile = function(file, path) { // handle file uploading console.log(file, path); var reader = new FileReader(); reader.addEventListener("load", function(e) { pre.textContent += "n" + e.target.result; }); reader.readAsText(file) }; var iterateFilesAndDirs = function(filesAndDirs, path) { for (var i = 0; i < filesAndDirs.length; i++) { if (typeof filesAndDirs[i].getFilesAndDirectories === 'function') { var path = filesAndDirs[i].path; // this recursion enables deep traversal of directories filesAndDirs[i].getFilesAndDirectories() .then(function(subFilesAndDirs) { // iterate through files and directories in sub-directory iterateFilesAndDirs(subFilesAndDirs, path); }); } else { uploadFile(filesAndDirs[i], path); } } }; if ("getFilesAndDirectories" in event.target) { event.target.getFilesAndDirectories() .then(function(filesAndDirs) { iterateFilesAndDirs(filesAndDirs, '/'); }) } else { // do webkit stuff var files = event.target.files; for (var i = 0; i < files.length; i++) { (function(file) { uploadFile(file) }(files[i])) } } })<!DOCTYPE html><html><head> <script></script></head><body> <input type="file" webkitdirectory allowdirs directory /> <pre></pre></body></html>对于可以
ajax在铬,铬
file:协议本地文件系统上启动的请求,可以
--allow-file-access-from-files设置标志来启动。
在Firefox中你可以设置
security.fileuri.strict_origin_policy到
false,看到
Security.fileuri.strictoriginpolicy。
对于
$.ajax()铬的一种可行方法,您可以尝试使用铬
var path = "/path/to/drectory"; // `D:`, `file:///`var files = [];$.ajax({url:path, dataType:"text html"}).then((data) => { // match file names from `html` returned by chrome, chromium // for directory listing of `D:Finalteststest1newplaces`; // you can alternatively load the "Index of" document and retrieve // `.textContent` from `<a>` elements within `td` at `table` of // rendered `html`; note, `RegExp` to match file names // could probably be improved, does not match space characters in file names var urls = $.unique(data.match(/b(w+|d+).txtb/g)); return $.when.apply($, $.map(urls, (file) => { files.push(file); // ``, or `/`, depending on filesystem type return $.ajax({url:path + "/" + file , dataType:"text html"}) .then((data) => { // return array of objects having property set to `file` name, // value set to text within `file` return {[file]:data} }) }))}).then((...res) => { console.log(res, files)})


