HTML / Javascript两次不允许相同的文件输入

时间:2016-07-28 16:04:21

标签: javascript html file

嘿,我有一个小的HTML代码

<input type="file" id="fileInput" multiple onchange="readSingleFile(this)">
<p align="center">
    <button class='btn btn-primary' onclick="javascript:callValidatorService();">VALIDATE</button>
    <button class='btn btn-primary' id="fileSelectButton">BROWSE</button>
    <button class='btn btn-primary' onclick="javascript:loadSample();">SAMPLE</button>
    <button class='btn btn-primary' onclick="javascript:clearText();">CLEAR</button>
</p>

<script>
    function click(el) {
        // Simulate click on the hidden file element.
        var evt = document.createEvent('Event');
        evt.initEvent('click', true, true);
        el.dispatchEvent(evt);
    }

    document.querySelector('#fileSelectButton').addEventListener('click', function(e) {
        //When we click the browse button, instead click the hidden file element.
        var fileInput = document.querySelector('#fileInput');
        fileInput.click();
    }, false);
</script>

这允许显示弹出菜单以允许用户选择文件。但是,即使文件内容发生了变化,它也不允许同一文件名的多个输入。

以下是我的javascript代码

function readSingleFile(fileElement) {

    //This is how users submit a file using the browse button.
    var f = fileElement.files[0];
    if (f) {
        var r = new FileReader();
        r.onload = function(e) {
            var contents = e.target.result;
            document.getElementById("inputText").value = contents;
            callValidatorService();
        }
        r.readAsText(f);

    } else {
        alert("Failed to load file");
    }
    fileElement.files[0] = null;
    r = null;
    contents = null;
    f = null;

}

我认为改变只关心文件的内容而不是文件名吗?

谢谢

0 个答案:

没有答案