Question

我正在创建各种搜索引擎，使用Wikipedia API查询内容。按照目前的情况，用户可以进行搜索输入，页面返回前10个结果，包含链接和片段。当用户进行另一次搜索时，我遇到了困难，在这种情况下，页面只是再次附加原始搜索结果。我尝试过使用replaceWith（）和html（），但是它们要么阻止搜索结果通过（如果我把它们放在事件处理程序中），要么它们不会被触发（如果它们不在事件处理程序）。我希望实现一个结果，用户可以进行另一个输入，页面将用新的搜索结果替换当前内容。

以下是我目前的情况：

JS：

var results = [];

$("#search").on("keydown", "#searchinput", function(event) {
  if (event.key === "Enter") {
    var searchParameter = encodeURIComponent(this.value);
    var link = "https://en.wikipedia.org/w/api.php?action=opensearch&search=" + searchParameter + "&limit=10&namespace=0&format=json&origin=*";
    $.getJSON(link, function(data) {
      for (var key in data) {
        results.push(data[key]);
      }
      for (var i = 0; i < 10; i++) {
        $("#results").append("<div class=\"resultContent\">" + "<h2>" + "<a href=\"" + results[3][i] + "\">" + results[1][i] + "</a>" + "</h2>" + "<p>" + results[2][i] + "<br/>" + "</p>")
      }
    })
  }
})

HTML：

<a href="https://en.wikipedia.org/wiki/Special:Random">Feeling Bold? Click Here for a Random Article</a>

<div id="search">
  <span>Search:</span>
  <input type="text" id="searchinput" autocomplete="off"></input>
</div>

<div id="results"></div>

感谢您的帮助！

Answer 1

您可以在循环之前删除当前结果：

mytable

如何替换用户输入的当前页面内容？

1 个答案: