Js + html 批量上传txt文件,读取文件内容

 

滚动条的自定义化，往往在做移动web的时候，能为我们的项目增添不少风采，而且通过为其添加-webkit-overflow-scrolling : touch;  的css属性，使其有着如同ios系统浏览器中bounce的效果，这里的话，提供一个仿ios风格自定义滚动条的demo，代码如下：

复制代码
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <title>Document</title>
  6. <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
  7. </head>
  8. <body>
  9. <div>
  10. 上传文件 ： <input type="file" name="file" multiple id="fileId" />
  11. <button type="submit" name="btn" value="提交" id="btnId" onclick="check()">提交</button>
  12. </div>
  13. <script type="text/javascript">
  14. function check() {
  15. var objFile = document.getElementById("fileId");
  16. if(objFile.value == "") {
  17. alert("不能空")
  18. }
  19. var files = $('#fileId').prop('files'); //获取到文件列表
  20. console.log(files.length);
  21. if(files.length == 0) {
  22. alert('请选择文件');
  23. } else {
  24. for(var i = 0; f = files[i]; i++) {
  25. var reader = new FileReader(); //新建一个FileReader
  26. reader.readAsText(files[i], "UTF-8"); //读取文件
  27. reader.onload = function(evt) { //读取完文件之后会回来这里
  28. var fileString = evt.target.result; // 读取文件内容
  29. console.log(fileString)
  30. }
  31. }
  32. }
  33. }
  34. </script>
  35. </body>
  36. </html>

posted on 2018-03-16 09:56  里先森  阅读(4379)  评论(0)  编辑  收藏  举报

导航