【问题标题】:My jekyll/github website got error when i try to search当我尝试搜索时,我的 jekyll/github 网站出现错误
【发布时间】:2021-03-19 09:37:58
【问题描述】:

我是一名非技术专业的学生,​​试图为我的项目建立一个网站。我遇到了一个名为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

【问题讨论】:

  • 不要暗示人们应该访问您的 GitHub Pages 站点来亲自查看错误,而是请在您的问题正文中包含确切的错误文本。如果没有它,一旦您表面上修复了导致错误的代码或其他问题,该问题的未来访问者将无法从您的问题和后续答案中获得几乎同样多的价值。
  • 此外,我发现“我无法提供有关我的代码的更多详细信息,因为我是非技术学生”这句话有点奇怪 - 你介意详细说明这个想法吗再远一点? Stack Overflow 和其他地方的许多贡献者不会将自己描述为“技术 [nical] 学生”,他们往往无法提供他们编写的代码的所有相关细节。

标签: javascript html jekyll lunrjs


【解决方案1】:

自编写该教程以来,Lunr 库已更新(有关详细信息,请参阅 the docs)。您需要更新 searchTerm 条件中的 lunr 函数。 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

}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2022-12-10
    • 2022-01-02
    • 2018-02-02
    • 1970-01-01
    • 2014-03-08
    • 2021-05-21
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多