首页 > 解决方案 > 有人可以帮我解释为什么这个常量返回 null

问题描述

错误消息我不断收到 Uncaught TypeError: form.querySelector(...) is null 直到不久前一切正常,所以我必须更改一些我不知道的关于 file:///C:/Users/Ben /Documents/下载文本文件/v12/v12 test .html:35

<html>
<form name="addtext">
<table>
<tr>
        <tr>
            <th> Fan Delay </th>
            <th><input id="fanDelay" type="text" name="fanDelay" value="0"   /></th>
        </tr>
        
</table>
    <table class="center">  
        <th></th>
        <th> <input type="submit" name="name" value="Save File" placeholder="File Name" /> </th>
    </table>
 </form>

</html>


<script>

/* Run script after DOMContentLoaded event to ensure form element is 
present */
document.addEventListener("DOMContentLoaded", function() {
  /* Obtain form element via querySelector */
  const form = document.querySelector('form[name="addtext"]');

  /* Bind listener to forms submit event */
  form.addEventListener("submit", function(event) {
    /* Prevent browsers default submit and page-reload behavior */
    event.preventDefault();

    
    var fanDelay   = form.querySelector('select[name="fanDelay"]').value;

        
    //
    const text =
`TACm Settings
VER
PRO
dt:  ${fanDelay}
    `;

    /* Create temporary link element and trigger file download  */
    const link = document.createElement("a");
    const href = "data:text/plain;charset=utf-8," + encodeURIComponent(text);
    link.setAttribute("href", href);
    link.setAttribute("download", "usb.txt");

    document.body.appendChild(link);

    link.click();

    document.body.removeChild(link);
  });
});

</script>

标签: javascripthtmlforms

解决方案


我认为错误来自这里form.querySelector('select[name="fanDelay"]').value

您正在使用<input>标签,所以只需将其更改为此 form.querySelector('input[name="fanDelay"]').value


推荐阅读