Question

我看了一篇帖子How do I read in a local text file with javascript?

我想添加一个按钮来模拟上传。所以我的考虑是设置一个观察者来点击onchange处理，是否可能？

JS

function readMultipleFiles(evt) {
//Retrieve all the files from the FileList object
var files = evt.target.files;

if (files) {
    for (var i = 0, f; f = files[i]; i++) {
        alert(f);
        var r = new FileReader();
        r.onload = (function (f) {
            return function (e) {
                var contents = e.target.result;
                alert(contents);
            };
        })(f);
        r.readAsText(f);
      }
    } else {
      alert("Failed to load files");
    }
}
document.getElementById('fileinput').addEventListener('change', readMultipleFiles, false);

HTML

<input type="file" id="fileinput" multiple />

Answer 1

添加按钮并添加点击处理程序

，而不是更改处理程序

<input type="file" id="fileinput" multiple />
<button id="read">Read</button>

然后

jQuery(function ($) {
    function readMultipleFiles(input) {
        //Retrieve all the files from the FileList object
        var files = input.files;

        if (files && files.length) {
            for (var i = 0, f; f = files[i]; i++) {
                var r = new FileReader();
                r.onload = (function (f) {
                    return function (e) {
                        var contents = e.target.result;
                        alert(contents);
                    };
                })(f);
                r.readAsText(f);
            }
        } else {
            alert("Failed to load files");
        }
    }

    var fileIn = $('#fileinput')[0];
    $('#read').click(function () {
        readMultipleFiles(fileIn)
    })
})

演示：Fiddle

在onchange事件处理中设置onclick事件观察器可能吗？

1 个答案: