小編給大家分享一下JavaScript如何實現(xiàn)txt文件上傳預覽功能，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
10余年專注成都網(wǎng)站制作，企業(yè)網(wǎng)站設計，個人網(wǎng)站制作服務，為大家分享網(wǎng)站制作知識、方案，網(wǎng)站設計流程、步驟,成功服務上千家企業(yè)。為您提供網(wǎng)站建設,網(wǎng)站制作,網(wǎng)頁設計及定制高端網(wǎng)站建設服務,專注于企業(yè)網(wǎng)站設計,高端網(wǎng)頁制作,對除甲醛等多個領域，擁有多年設計經(jīng)驗。
今天做項目剛好碰到這個記錄一下。因為是簡單的txt文件，只涉及文本，如果需要涉及圖片預覽就需要使用papaparse和jschardet，此處不多敘述。
表單按鈕使用js的onchange=”uploadfile()” 事件，function函數(shù)代碼如下所示：
重慶分公司
重慶分公司
//此處為txt文件上傳預覽的js代碼
function uploadfile(){
var file=$("#txt")[0].files[0];
//判斷上傳文件是不是txt格式,判斷后綴是不是.txt
if(file.name.substr(-4).toLocaleLowerCase() != '.txt'){
alert("請上傳格式為txt的文件！");
windows.location="test.jsp";//重新定位到上傳txt文件頁面
}
else//如果上傳文件是txt文件，則顯示文件的預覽
{
var reader=new FileReader;
reader.readAsText(file,'gb2312');
//reader.readAsDataURL(file);
reader.onload=function(evt){
var data=evt.target.result;
$('#textarea_id').val(data);
}
}
}效果如下：
提示上傳文件類型錯誤
補充：
js 上傳文件預覽
1. FILE API
html5提供了FIle和FileReader兩個方法，可以讀取文件信息并讀取文件。
2. example
