如何只用一个按钮从文件加载文本?

时间:2013-05-03 09:30:29

标签: javascript html

我正在尝试使用字符替换来编码消息加密/解密页面。 我设法将密钥保存到文件中,我想将其加载回来。 我设法用这个加载密钥:

    <script>
    function loadkey () {
    var keyToLoad = document.getElementById("keyToLoad").files[0];
    var keyReader = new FileReader();
    keyReader.onload = function(keyLoadEvent)
    {
        var keyFromFileLoaded = keyLoadEvent.target.result;
        document.getElementById("key").value = keyFromFileLoaded;
    };
    keyReader.readAsText(keyToLoad, "utf-8");
}
</script>

<h3>Put your key here</h3>
<textarea id="key" cols="30" rows="1"></textarea>
<br>
<button onclick="genKey()">Generate  key</button>
<button onclick="savekey()">Save key</button>
<input type="file" id="keyToLoad">
<button onclick="loadkey()">Load key</button>

但它有点愚蠢与选择文件按钮和加载键按钮分开。 所以我隐藏输入按钮并通过单击加载键按钮触发它:

<script>
    function handleChooseKey()
{
    document.getElementById("keyToLoad").click();
}

function loadkey () {
    var keyToLoad = document.getElementById("keyToLoad").files[0];
    var keyReader = new FileReader();
    keyReader.onload = function(keyLoadEvent)
    {
        var keyFromFileLoaded = keyLoadEvent.target.result;
        document.getElementById("key").value = keyFromFileLoaded;
    };
    keyReader.readAsText(keyToLoad, "utf-8");
}
</script>

<h3>Put your key here</h3>
<textarea id="key" cols="30" rows="1"></textarea>
<br>
<button onclick="genKey()">Generate  key</button>
<button onclick="savekey()">Save key</button>
<input type="file" id="keyToLoad" style="display:none;">
<button onclick="handleChooseKey();loadkey();">Load key</button>

我的问题是无法在加载密钥文件后使loadkey()函数正常工作,因此在下次单击之前不会加载密钥。请帮我。谢谢:))

1 个答案:

答案 0 :(得分:0)

试试这个:

<script>
    function handleChooseKey()
{
    document.getElementById("keyToLoad").click();
    document.getElementById("keyToLoad").onchange = function(e) { loadkey() };
}

function loadkey () {
    var keyToLoad = document.getElementById("keyToLoad").files[0];
    var keyReader = new FileReader();
    keyReader.onload = function(keyLoadEvent)
    {
        var keyFromFileLoaded = keyLoadEvent.target.result;
        document.getElementById("key").value = keyFromFileLoaded;
    };
    keyReader.readAsText(keyToLoad, "utf-8");
}
</script>

<h3>Put your key here</h3>
<textarea id="key" cols="30" rows="2"></textarea>
<br>
<button onclick="genKey()">Generate  key</button>
<button onclick="savekey()">Save key</button>
<input type="file" id="keyToLoad" style="display:none;">
<button onclick="handleChooseKey();">Load key</button>