Javascript - 未捕获的类型错误：无法设置属性“onclick”为空（搜索栏）答案

【问题标题】：Javascript - Uncaught TypeError: Cannot set property 'onclick' of null (Search Bar)Javascript - 未捕获的类型错误：无法设置属性“onclick”为空（搜索栏）
【发布时间】：2021-02-15 20:04:07
【问题描述】：

我试图让我在搜索栏中写的单词出现在控制台上，但它似乎总是“null”。我查看了其他答案，它似乎总是一个“onload”问题，我不相信我有这个问题，因为在我的 html 中，我的 body 有一个“onload”，它可以完成我的设置。

设置确实与 Firebase 相关，但是当我取消注释“btn.onclick = search”时，它会给我“无法将属性 'onclick' 设置为 null”，即使元素 id 为 'btn ' 在代码中。

所以我把它改成了'onMouseDown = 'search()''，但是虽然它确实打印出测试值5，它不会打印出除了'searchBar'的null之外的任何东西，即使里面的值是自动“搜索...”。知道为什么会这样吗？

代码：

function setup(){
    initializeFirebase();
    var database = firebase.database();
    var featuredRef = database.ref("Featured/");
    var featured_ul = document.getElementById("featured_links");
    setupLunr(featuredRef, featured_ul);

    //var btn = document.getElementById(btn);
    //btn.onclick = search;
    //createServer();
}

function search(){
    console.log(5);
    var inputHandle = document.getElementById(searchBar);
    console.log(inputHandle.value);
    // var tag = inputHandle.value;
    // console.log(tag);
    // index.search(tag);
    //console.log(index.search(tag));
    // console.log(inputHandle);

}

<body onload="setup()">
  <input type="text" id="searchBar" value="Search..." maxlength="30" autocomplete="off" onMouseDown="active();" onBlur="inactive();" /> 
  <button id="btn" onMouseDown="search();">Go</button>
  
  <h1>featured</h1>
  <ul id="featured_links"></ul>
</body>

【问题讨论】：

您是否将正确的字符串传递给 getElementById()？也许你错过了一些双引号？ ... document.getElementById("btn")

标签： javascript search null

【解决方案1】：

由于您没有得到像 Uncaught ReferenceError: searchBar is not defined(…) 这样的东西，我只能假设 'searchBar' 是在某处定义的并且其中有一些不相关的值。

无论如何你都应该改变：

var inputHandle = document.getElementById(searchBar);

进入

var inputHandle = document.getElementById("searchBar");

（注意引号）

编辑：哦，你说的是btn。反正都是一样的交易，应该是

var btn = document.getElementById("btn");

除非 'btn' 是包含您要查找的 id 的 var 的名称。

【讨论】：

我讨厌我的生活。谢谢一堆。浪费了最愚蠢的时间