各位好,我最近在搞html5 file reader ,读取本地文本文件,可是搜了好多答案,搞不定文本路径到底要写在哪儿?

这是我从网上找的一个页面,大概修改简单修改了一点,可是点击导入按钮后没有任何反应,到是代码有问题呢,还是这个路径没写呢,可我找不到写的地方,烦请懂得指点一下,谢谢!

<!DOCTYPE html>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UFT-8">

<script src="jquery-1.8.2.js" ></script>
<script src="FileSaver.js" charset="utf-8"></script>
</head>
<body >


<div>
 <div>
<input type="file" id="files" style="display:none" onchange="fileimport();"/>
<input type="button" id="import" value="导入"/>

        <input type="button" id="export" value="导出"/>
     </div>
</div>
<script>
var txtdata;
function fileimport()
{
    var selectedFile = document.getElementById("files").files[0];//获取读取的File对象
    var name = selectedFile.name;//读取选中文件的文件名
    var size = selectedFile.size;//读取选中文件的大小
    console.log("文件名:"+name+"大小:"+size);


    var reader = new FileReader();//这里是核心!!!读取操作就是由它完成的。
    reader.readAsText(selectedFile,'gb2312');//读取文件的内容,注意编码方式


    reader.onload = function(){
        console.log(this.result);//当读取完成之后会回调这个函数,然后此时文件的内容存储到了result中。直接操作即可。
$('<pre>' + this.result + '</pre>').appendTo('body');
txtdata = this.result;
    };
}




$(document).ready(function(){
//alert("start");
$("#import").click(function(){//点击导入按钮,使files触发点击事件,然后完成读取文件的操作。
        $("#files").click();
    });

$("#export").click(function(){
    var content = "这是直接使用HTML5进行导出的:"+txtdata;
    var blob = new Blob([content], {type: "text/plain;charset=utf-8"});
    saveAs(blob, "file.txt");//saveAs(blob,filename) //仅限于chorme的下载目录里
//alert("export OK")
});
})
</script>
</body>
</html>
阅读 1.8k
1 个回答

你的代码我本地运行了 导入是可以导入的 但是有时候会乱码。我本地就只是引用了个jq库

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题