如何在 HTML 中动态更改 <a>“下载”字段的值

How to dynamically change the value of the <a> 'download' field in HTML?

本文关键字：字段 下载 HTML 动态      更新时间：2023-09-26

>我有以下内容：

        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>

我需要通过"文件名"字段设置下载的文件名。最简单的方法是什么？

尝试在各自的元素上使用.attr()和.val()来完成你的任务，

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

如果你不使用jquery，你只需使用普通的Javascript。 这是代码。

    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>
相关文章：