javascript - 输入 "?"后如何将搜索词重定向到新页面？

Question

我正在构建一个带有搜索功能的引擎，并且正在寻找一种方法，一旦用户点击“？”，它就会将我的查询重定向到答案页面。键。

例如

1. 查询中的用户类型。什么是 4 + 4

2. 跟在“?”之后。

3. 出现过渡，然后重定向到带有问题和答案的新页面。

这是我目前的代码:

HTML:

<form>
  <input type="text" name="search"></form>

CSS:

input[type=text] {
  width: 50%;
  padding: 15px 20px;
  margin: 0px 0;
  border: none;
  background-color: #000;
  color: #fff;
  font-family: 'Roboto', sans-serif;
  font-size: 1.3em;
  border: 2px #000;
  border-radius: 5px;
  font-style: normal;
  text-align: center;
}

我不确定 CSS、JS 或其他编码技能是否最适合我要实现的目标。任何帮助将不胜感激!

Answer 1

您可以让一个事件监听器监听您的输入字段，并在每个键向上检查键的值。如果 key 是您正在寻找的 key ，例如“？”然后获取该输入字段的数据并进行进一步处理。

我建议您为您的输入字段提供一些 id，以便它是唯一的并且您可以轻松访问它。

var field = document.getElementById('search');

field.addEventListener('keyup',function(){
  var searchText = this.value;
  if(searchText.indexOf('?') > -1){//Means there is ?
    var textToProcess = searchText;
    //do anything you want with this
  }

})

<input type="text" id="search" name="search">

如果你想监听 name 而不是 id，那么

var field = document.getElementsByName('search')[0];

由于 getElementsByName 将返回元素集合，因此您必须手动提供字段索引(如果您有多个同名字段，则 [0] 即可)