elasticlunr.js不显示搜索查询结果

我用elasticlunr.js搜索引擎。elasticlunr.js不显示搜索查询结果

我编辑他们的源代码示例

$('input').bind("enterKey", function (e) { 

    var value_test = $("#inputSuccess1").val(); 

    if ($(this).val() < 2) return 
    var config = $('#configuration').val(); 
    config.trim(); 
    var json_config = null; 
    if (config != '') { 
     json_config = new elasticlunr.Configuration(config, idx.getFields()).get(); 
    } 

    var query = value_test; 
    var results = null; 

    console.log(query); 

    if (json_config == null) { 
     results = idx.search(query).map(function (result) { 
      console.log(result); 
      return questions.filter(function (q) { 
       console.log(q); 
       return q.page_id === parseInt(result.ref, 10) 
      })[0] 
     }) 
    } else { 
     results = idx.search(query, json_config).map(function (result) { 
      return questions.filter(function (q) { 
       return q.page_id === parseInt(result.ref, 10) 
      })[0] 
     }) 
    } 
    renderQuestionList(results); 
    console.log(results); 
});

所有保存的搜索结果显示的负荷，但是当我输入搜索查询时，它返回认为未编辑的搜索结果。尽管搜索结果数组被填充（例如）2个项目，但它仍未定义。我试图把我自己的结果（只是1）放在example_index.json上，并尝试输入与它相关的标签。它仍然不显示。

HTML代码

<body> 
<div id="wrapper"> 
    <main class="main" role="main" style="margin-top: 30px"> 
     <div class="container"> 
      <div class="row"> 
       <header style="margin-left: 15px; margin-right: 15px;"> 
        <h1>Elasticlunr<span>.js</span></h1> 
        <h2>Lightweight full-text search engine in Javascript for browser search and offline search.</h2> 
       </header> 
      </div> 

      <div class="row"> 
       <div class="col-md-6"> 
        <span><strong><i>Search Configuration:</i></strong></span> 
        <textarea id="configuration" class="form-control" rows="6" style="font-size: 0.8em;"></textarea> 
       </div> 

       <div class="col-md-6" style="margin-left: 0px; margin-right: 0px; padding-right: 0px; padding-left: 0px;"> 
        <span><strong><i>Configuration Example:</i></strong></span> 

       </div> 
      </div> 

      <div class="row" style="margin-left: 0px; margin-right: 0px; border-top-style: solid; border-top-width: 0px; padding-top: 10px;"> 
       <div class="col-md-6" style="padding-left: 0px; padding-right: 50px"> 
        <form> 
         <div class="form-group has-success"> 
          <div class="col-xs-9" style="padding-left: 0px;"> 
           <input type="search" class="form-control" id="inputSuccess1" > 
          </div> 
         </div> 
         <div><a class="all btn btn-primary btn-block" href="#">All</a></div> 
        </form> 
       </div> 
       <div class="col-md-12" style="margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid rgba(7, 94, 115, 0.3); padding-left: 0px;"></div> 
      </div> 

      <div class="row" style="margin-left: 0px; margin-right: 0px;"> 
       <div class="col-md-6" style="margin-left: 0px; margin-right: 0px;"> 
        <div id='question-list-container' style="margin-left: 0px; margin-right: 0px;"></div> 
       </div> 

       <div class="col-md-6" style="margin-left: 0px; margin-right: 0px; padding-right: 0px; padding-left: 0px;"> 
        <div id='question-view-container' style="margin-left: 0px; margin-right: 0px; padding-right: 0px; padding-left: 0px;"></div> 
       </div> 
       <div class="col-md-12" style="padding-bottom: 15px; border-bottom:1px solid rgba(7,94,115,0.3);"></div> 
      </div> 
     </main> 
    </div> 
    <!-- end of wrapper --> 

    <!-- Begin footer --> 
    <footer class="footer vertical-center"> 
     <div class="container"> 
      <p class="pull-right text-muted"><a href="#">Back to top</a> 
      </p> 
      <p class="text-muted">Copyright &copy; Wei Song 2015. 
       <a href="https://github.com/weixsong">https://github.com/weixsong</a> [email protected] Donate by Alipay: [email protected]</p> 
     </div> 
    </footer> 

    <script> 
     (function(hijs) { 
      // 
      // hijs - JavaScript Syntax Highlighter 
      // 
      // Copyright (c) 2010 Alexis Sellier 
      // 

      // All elements which match this will be syntax highlighted. 
      var selector = hijs || 'pre'; 

      var keywords = ('var function if else for while break switch case do new null in with void ' + 'continue delete return this true false throw catch typeof with instanceof').split(' '), 
       special = ('eval window document undefined NaN Infinity parseInt parseFloat ' + 'encodeURI decodeURI encodeURIComponent decodeURIComponent').split(' '); 

      // Syntax definition 
      // The key becomes the class name of the <span> 
      // around the matched block of code. 
      var syntax = [ 
       ['comment', /(\/\*(?:[^*\n]|\*+[^\/*])*\*+\/)/g], 
       ['comment', /(\/\/[^\n]*)/g], 
       ['string', /("(?:(?!")[^\\\n]|\\.)*"|'(?:(?!')[^\\\n]|\\.)*')/g], 
       ['regexp', /(\/.+\/[mgi]*)(?!\s*\w)/g], 
       ['class', /\b([A-Z][a-zA-Z]+)\b/g], 
       ['number', /\b([0-9]+(?:\.[0-9]+)?)\b/g], 
       ['keyword', new(RegExp)('\\b(' + keywords.join('|') + ')\\b', 'g')], 
       ['special', new(RegExp)('\\b(' + special.join('|') + ')\\b', 'g')] 
      ]; 
      var nodes, table = {}; 

      if (/^[a-z]+$/.test(selector)) { 
       nodes = document.getElementsByTagName(selector); 
      } else if (/^\.[\w-]+$/.test(selector)) { 
       nodes = document.getElementsByClassName(selector.slice(1)); 
      } else if (document.querySelectorAll) { 
       nodes = document.querySelectorAll(selector); 
      } else { 
       nodes = []; 
      } 

      for (var i = 0, children; i < nodes.length; i++) { 
       children = nodes[i].childNodes; 

       for (var j = 0, str; j < children.length; j++) { 
        code = children[j]; 

        if (code.length >= 0) { // It's a text node 
         // Don't highlight command-line snippets 
         if (!/^\$/.test(code.nodeValue.trim())) { 
          syntax.forEach(function(s) { 
           var k = s[0], 
            v = s[1]; 
           code.nodeValue = code.nodeValue.replace(v, function(_, m) { 
            return '\u00ab' + encode(k) + '\u00b7' + encode(m) + 
             '\u00b7' + encode(k) + '\u00bb'; 
           }); 
          }); 
         } 
        } 
       } 
      } 
      for (var i = 0; i < nodes.length; i++) { 
       nodes[i].innerHTML = 
        nodes[i].innerHTML.replace(/\u00ab(.+?)\u00b7(.+?)\u00b7\1\u00bb/g, function(_, name, value) { 
         value = value.replace(/\u00ab[^\u00b7]+\u00b7/g, '').replace(/\u00b7[^\u00bb]+\u00bb/g, ''); 
         return '<span class="' + decode(name) + '">' + escape(decode(value)) + '</span>'; 
        }); 
      } 

      function escape(str) { 
       return str.replace(/</g, '&lt;').replace(/>/g, '&gt;'); 
      } 

      // Encode ASCII characters to, and from Braille 
      function encode(str, encoded) { 
       table[encoded = str.split('').map(function(s) { 
        if (s.charCodeAt(0) > 127) { 
         return s 
        } 
        return String.fromCharCode(s.charCodeAt(0) + 0x2800); 
       }).join('')] = str; 
       return encoded; 
      } 

      function decode(str) { 
       if (str in table) { 
        return table[str]; 
       } else { 
        return str.trim().split('').map(function(s) { 
         if (s.charCodeAt(0) - 0x2800 > 127) { 
          return s 
         } 
         return String.fromCharCode(s.charCodeAt(0) - 0x2800); 
        }).join(''); 
       } 
      } 

     })(window.hijs); 
    </script>

3日编辑：

我有这样的代码

$('input').keyup(function(e){ 
if(e.keyCode == 13) 
{ 
    $(this).trigger("enterKey"); 
}

}）;

我使用xampp，当我按下Enter时，会发生什么情况。那些“空列表”来自之前的.json文件，但具有不同的ID。我找不到那部分

它有很多的代码，所以我上传在这里（编辑：删除链接现已修复）

来源

2017-02-14 a_bldmr

是否可以提供一个小提琴或plunk？ –

我会尝试把它放在plunk –

我想我找到了现有链接的解决方案，但我现在要等待。 –

我阅读手册，错过和ingnored Node.js的一部分。正如你所看到的，index_builder.js使用了我学习的fs，它使用了node.js.你必须使用node.js并运行index_builder.js。这将从你的data.json（保存的搜索结果）建立一个index.json文件。该代码使用我必须重建索引的示例源代码。另外，我使用xampp作为本地主机。

Step 1. Download and Install node.js 
Step 2. Run Xampp Shell on elasticlunr project directory 
Step 3. Type in node index_builder.js 
Step 4. Elastic Search will work with the entered query

这是我index_builder.js

var elasticlunr = require('./elasticlunr.js'), 
fs = require('fs'); 

var idx = elasticlunr(function() { 
this.setRef('page_id'); 

this.addField('title'); 
this.addField('tags'); 
this.addField('body'); 
this.addField('url'); 
}); 



fs.readFile('./example_data.json', function (err, data) { 
if (err) throw err; 

var raw = JSON.parse(data); 

var questions = raw.questions.map(function (q) { 
return { 
    page_id: q.page_id, 
    title: q.title, 
    body: q.body, 
    url: q.url, 
    tags: q.tags.join(' ') 
    }; 
}); 

questions.forEach(function (question) { 
idx.addDoc(question); 
}); 

fs.writeFile('./example_index.json', JSON.stringify(idx), function (err) { 
if (err) throw err; 
console.log('done'); 
}); 
});

感谢的代码！

来源

2017-02-15 02:58:24

的input标签form标签之间存在。这意味着在按下输入表单后会提交，因此页面会重新加载，从而删除您放置的任何信息并显示未掺杂的结果。

在开发人员提供的示例中，使用$('input').bind('keyup', debounce(function() {。因此，在输入文本时搜索标签。但是，就您而言，控件甚至不会转移到您打算运行的代码。

请检查这个 https://jsfiddle.net/kaminasw/rqj68xt5/它应该在按下输入时显示警报。

$('input').bind("enterKey",function(e){ 
    alert(); 
});

尝试使用与keyup事件的实际代码，并与enterKey代码比较按键即13

$('input').keyup(function(e) { 
    // 13 is ENTER 
    if (e.which === 13) 
    // Perform action 
});

来源

2017-02-14 09:07:45

我使用XAMPP的地方。我发现输入在表单内部，即使输入在表单内部，它仍然有效，但它给了我空的结果（请参阅第3次编辑）。这是有帮助的寿。在网络主机。它做你刚刚说的。它重新加载。感谢那。 –

Upvote and answer selection pls。哈哈。^_^ –

我upvoted。我如何把它放在答案选择中。 –

elasticlunr.js不显示搜索查询结果

回答

相关问题