按下Enter键时如何显示提醒

时间:2018-10-07 20:12:07

标签: javascript javascript-events

我正在尝试获取警报消息,但是它根本没有显示。它仅显示我是否从:function myFunction(event)

删除了(事件)

您能帮我解决这个问题,以便当我输入少于3个字母时显示警告框吗?这是我坚持的代码:

function myFunction(input, e) {
  var input, filter, table, tr, td, i;
  filter = input.value.toUpperCase();
  table = document.getElementById("myTable");
  tr = table.getElementsByTagName("tr");
  if (filter.length < 3 && e.key === "Enter") {
    alert(
      "Search is going to work only if the phrase contains at least 3 characters."
    );
    return;
  }
  for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[1];
    if (td) {
      if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
        tr[i].style.display = "";
      } else {
        tr[i].style.display = "none";
      }
    }
  }
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">

</head>
<body>

<h2>My Customers</h2>

<input type="text" id="myInput" onkeyup="myFunction(this, event)" placeholder="Search for names.." title="Type in a name">

<table id="myTable">
  <tr class="header">
    <th>Name</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Berglunds snabbkop</td>
    <td>Sweden</td>
  </tr>
  <tr>
    <td>Island Trading</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>Koniglich Essen</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Laughing Bacchus Winecellars</td>
    <td>Canada</td>
  </tr>
  <tr>
    <td>Magazzini Alimentari Riuniti</td>
    <td>Italy</td>
  </tr>
  <tr>
    <td>North/South</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>Paris specialites</td>
    <td>France</td>
  </tr>
</table>


</body>
</html>

我该如何解决?

编辑:我添加了html代码以显示有关该问题的更多信息

2 个答案:

答案 0 :(得分:1)

请参见工作示例。

calcute
calculate

答案 1 :(得分:0)

捕获事件并获取keyCode(如果它等于13则为回车键)

e.key === 13