javascript - 当我尝试搜索时，我的 jekyll/github 网站出现错误

Question

我是一名非技术学生，试图为我的项目建立一个网站。我遇到了一个名为beautiful-jekyll 的神奇模板，到目前为止它运行良好。但是，当我尝试根据本教程https://learn.cloudcannon.com/jekyll/jekyll-search-using-lunr-js/实现搜索引擎时，它不起作用，但一直给我错误页面。我的模板代码位于https://github.com/nhatdang1411/nhatdang1411.github.io这是我添加的一些代码，用于根据给定的指令实现搜索栏

(function() {
  function displaySearchResults(results, store) {
    var searchResults = document.getElementById('search-results');

    if (results.length) { // Are there any results?
      var appendString = '';

      for (var i = 0; i < results.length; i++) {  // Iterate over the results
        var item = store[results[i].ref];
        appendString += '<li><a href="' + item.url + '"><h3>' + item.title + '</h3></a>';
        appendString += '<p>' + item.content.substring(0, 150) + '...</p></li>';
      }

      searchResults.innerHTML = appendString;
    } else {
      searchResults.innerHTML = '<li>No results found</li>';
    }
  }

  function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split('&');

    for (var i = 0; i < vars.length; i++) {
      var pair = vars[i].split('=');

      if (pair[0] === variable) {
        return decodeURIComponent(pair[1].replace(/\+/g, '%20'));
      }
    }
  }

  var searchTerm = getQueryVariable('query');

  if (searchTerm) {
    document.getElementById('search-box').setAttribute("value", searchTerm);

    // Initalize lunr with the fields it will be searching on. I've given title
    // a boost of 10 to indicate matches on this field are more important.
    var idx = lunr(function () {
      this.field('id');
      this.field('title', { boost: 10 });
      this.field('author');
      this.field('category');
      this.field('content');
    });

    for (var key in window.store) { // Add the data to lunr
      idx.add({
        'id': key,
        'title': window.store[key].title,
        'author': window.store[key].author,
        'category': window.store[key].category,
        'content': window.store[key].content
      });

      var results = idx.search(searchTerm); // Get lunr to perform a search
      displaySearchResults(results, window.store); // We'll write this in the next section
    }
  }
})();

很抱歉，因为我是非技术学生，所以我无法提供有关我的代码的更多详细信息。如果您可以在我的 github 页面上查看我的代码并给我一些解决此问题的建议，这对我来说意味着世界。我的搜索框位于 nhatdang1411.github.io

标签： javascripthtmljekylllunrjs

Answer 1

Lunr 库自该教程编写以来已更新（有关详细信息，请参阅文档）。您将需要更新条件中的lunr函数searchTerm。根据for更新，循环需要包含在该函数中：

if (searchTerm) {
  document.getElementById('search-box').setAttribute('value', searchTerm);

  // Initalize lunr with the fields it will be searching on. I've given title
  // a boost of 10 to indicate matches on this field are more important.
  var idx = lunr(function () {
    this.field('id');
    this.field('title', { boost: 10 });
    this.field('author');
    this.field('category');
    this.field('content');

    for (var key in window.store) { // Add the data to lunr
      this.add({
        'id': key,
        'title': window.store[key].title,
        'author': window.store[key].author,
        'category': window.store[key].category,
        'content': window.store[key].content
      });
    }

  });

  var results = idx.search(searchTerm); // Get lunr to perform a search
  displaySearchResults(results, window.store); // We'll write this in the next section

}