ホームページ > ウェブフロントエンド > jsチュートリアル > txt ファイルをアップロードおよびプレビューするための js コード

txt ファイルをアップロードおよびプレビューするための js コード

小云云
リリース: 2018-03-26 17:19:10
オリジナル
2279 人が閲覧しました

この記事では、主に js で txt ファイルをアップロードしてプレビューするためのコードを説明します。これは単純な txt ファイルであるため、画像をプレビューする必要がある場合は、papaparse と jschardet を使用する必要はありません。ここで詳細を説明します。

フォームボタンはjsのonchange="uploadfile()"イベントを使用します。関数関数コードは次のとおりです:

//此处为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);   
        }   
    }   
}
ログイン後にコピー
ログイン後にコピー

効果は次のとおりです:
txt ファイルをアップロードおよびプレビューするための js コード
txt ファイルをアップロードおよびプレビューするための js コード
txt ファイルをアップロードおよびプレビューするための js コード

私は偶然これを見つけました。今日のプロジェクトに取り組みながら記録します。単純な txt ファイルなので、画像をプレビューする必要がある場合は、papaparse と jschardet を使用する必要があります。ここではあまり説明しません。
フォーム ボタンは、js の onchange="uploadfile()" イベントを使用します。関数関数コードは次のとおりです。

//此处为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);   
        }   
    }   
}
ログイン後にコピー
ログイン後にコピー

効果は次のとおりです。
txt ファイルをアップロードおよびプレビューするための js コード
txt ファイルをアップロードおよびプレビューするための js コード
txt ファイルをアップロードおよびプレビューするための js コード

関連する推奨事項:

PHP の読み取りtxt ファイルの行ごとのメソッド インスタンス

以上がtxt ファイルをアップロードおよびプレビューするための js コードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート