Question

https://pastebin.com/M21NAE2P

 <script>
  // get input element
    let filterInput = getElementById('filterInput');
    // add event listenter
    filterInput.addEventLister('keyup', filterNames);

    function filterNames(){
      console.log(1);
    }
  </script>

标记没有被IDE着色，当我运行它时它不起作用。是原子吗？或者它是我能解决的问题。

Answer 1

您已关闭标记中的<input>标记。在HTML中，<input>标记没有结束标记。你也无法嵌套<li>（我注意到你已经完成了）

另外，改变：

let filterInput = getElementById('filterInput');

到

let filterInput = document.getElementById('filterinput');

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.99.0/css/materialize.css">
  <title>My Contacts</title>
</head>

<body>
  <div class="container">
    <h1 class="center-align">
      My contacts
    </h1>
    <input type="text" id="filterinput" placeholder="Search Names">
    <ul id="names" class="collection with-header">
      <li class="collection-header">
        <h5>A</h5>
      </li>
      <li class="collection-item">
        <a href="#">Abe</a>
        <a href="#">Adam</a>
        <a href="#">Alan</a>
        <a href="#">Anna</a>
        <li class="collection-header">
          <h5>B</h5>
        </li>
        <li class="collection-item">
          <a href="#">Beth</a>
          <a href="#">Beth</a>
          <a href="#">Bill</a>
          <a href="#">Bob</a>
          <li class="collection-header">
            <h5>C</h5>
          </li>
          <li class="collection-item">
            <a href="#">Carry</a>
            <a href="#">Cortany</a>
            <a href="#">Crapy</a>
            <a href="#">Cheese</a>
          </li>
    </ul>
  </div>

  <script>
    // get input element
    let filterInput = document.getElementById('filterinput');
    // add event listenter
    filterInput.addEventLister('keyup', filterNames);

    function filterNames() {
      console.log(1);
    }
  </script>
</body>

</html>

Javascript打开标记无效？

1 个答案: