7

HTML フォームにいくつかの入力ボックスがあり、フォームの読み込み時に更新する必要があり、これらの値をテキスト ファイルからアップロードする必要があります。
同様の質問がここでも尋ねられました: Uploading Text File to Input in Html/JS

インターネットでこれを検索しましたが、正しい答えが見つかりませんでした。それで、それが可能かどうか知りたいですか?

4

2 に答える 2

15

クライアント側のルートに行きたい場合は、HTML5 FileReader API に興味があるでしょう。残念ながら、これに対する幅広いブラウザー サポートはありません。最新の Chrome と Firefox で動作すると思います。

実用的な例を次に示します: http://www.html5rocks.com/en/tutorials/file/dndfiles/#toc-reading-files

readAsTextまた、メソッドを見つけるためにここも読んでいます: http://www.w3.org/TR/file-upload/#dfn-readAsText

私はこのようなことをします(簡潔にするためにjQuery):http://jsfiddle.net/AjaDT/2/

Javascript

var fileInput = $('#files');
var uploadButton = $('#upload');

uploadButton.on('click', function() {
    if (!window.FileReader) {
        alert('Your browser is not supported');
        return false;
    }
    var input = fileInput.get(0);

    // Create a reader object
    var reader = new FileReader();
    if (input.files.length) {
        var textFile = input.files[0];
        // Read the file
        reader.readAsText(textFile);
        // When it's loaded, process it
        $(reader).on('load', processFile);
    } else {
        alert('Please upload a file before continuing')
    } 
});

function processFile(e) {
    var file = e.target.result,
        results;
    if (file && file.length) {
        results = file.split("\n");
        $('#name').val(results[0]);
        $('#age').val(results[1]);
    }
}

テキストファイル

Jon
25
于 2013-09-26T22:38:53.553 に答える