我的 HTML5/Javascript 代码不会多次执行相同的功能？答案

【问题标题】：My HTML5/Javascript code won't perform the same function multiple times?我的 HTML5/Javascript 代码不会多次执行相同的功能？
【发布时间】：2013-10-13 05:34:21
【问题描述】：

我一直在对一小段代码进行故障排除，该代码旨在允许用户选择本地文件，将本地文件的文本内容输入到变量中，然后将变量值转储到文本区域中。

这一切都很好，用户可以选择一个文件，然后在我的 textarea 中查看文件的内容。这是问题所在，我有一个名为“ClearAll”的按钮，它清除了 textarea 值。如果用户随后再次选择本地文件，则不会发生任何事情，并且文本区域永远不会被本地文件内容填充。

总而言之，选择本地文件一次可行，但第二次不行。

这是我的代码：

<input type="file" id="files" name="file" /><br>
<script>
    function handleFileSelect(evt) {
        var files = document.getElementById('files').files;
        if (!files.length) {
          alert('Please select a file!');
          return;
        }
        var file = files[0];
        var reader = new FileReader();
        reader.onloadend = function(evt) {
            if (evt.target.readyState == FileReader.DONE) { // DONE == 2
                document.getElementById('myInput').textContent = evt.target.result;
            }  
        };
        reader.readAsText(file, "UTF-8");
    }
document.getElementById('files').addEventListener('change', handleFileSelect, false);

...而且我还有一个按钮，只需将其值设置为=""，即可成功调用清除文本区域的函数。由于某种原因，textarea 人口只能工作一次。谁能看出这是为什么？

快速评论：我想如果我在激活 ClearAll 按钮时更改files 的内容，它可能会重置一些东西，但没有运气。

【问题讨论】：

有人有什么见解吗？我很乐意尝试任何建议，请指出正确的方向！

标签： javascript html io

【解决方案1】：

问题出在最后一行。当您选择相同的文件名时，事件更改不会触发两次。重命名文件并查看它是否有效。

【讨论】：