如何动态更改HTML中<a>'download'字段的值？

Question

我有以下几点：

 AUTHOR<input type="text" name="author" id="authortxt"><br> 
     FILENAME<input type="text" name="filename" id="filenametxt"><br> 
     EMAIL<input type="text" name="email" id="email"> 
     <img id="saveicon" src="interface/SaveIcon0.png" onmouseover="this.src='./interface/SaveIcon1.png'" onmouseout="this.src='./interface/SaveIcon0.png'" /> 
     <img id="cancelicon" src="interface/CancelIcon0.png" onmouseover="this.src='./interface/CancelIcon1.png'" onmouseout="this.src='./interface/CancelIcon0.png'" /> 
     <a id="download" download="TestJSON-r.json">Download</a> 

我需要下载的文件名由“文件名”字段设置。这样做的最简单方法是什么？

Answer 1

尝试，如果你不使用jQuery您只需使用普通的JavaScript使用.attr()和.val()在各元素来完成你的任务，

$("#download").attr("download", $("#filenametext").val()) 

Answer 2

。这里是代码。

AUTHOR<input type="text" name="author" id="authortxt"><br> 
    AUTHOR<input type="text" name="author" id="authortxt"><br> 
    FILENAME<input type="text" name="filename" id="filenametxt" onchange="change_download_text(this)"><br> 
    EMAIL<input type="text" name="email" id="email"> 
    <img id="saveicon" src="interface/SaveIcon0.png" onmouseover="this.src='./interface/SaveIcon1.png'" onmouseout="this.src='./interface/SaveIcon0.png'" /> 
    <img id="cancelicon" src="interface/CancelIcon0.png" onmouseover="this.src='./interface/CancelIcon1.png'" onmouseout="this.src='./interface/CancelIcon0.png'" /> 
    <a id="download" download="TestJSON-r.json">Download</a> 

    <script> 
     function change_download_text(calledvalue){ 
     var download = document.getElementById("download") ; 
     download.innerHTML = calledvalue.value ; 
     } 
    </script>