lunr.js实现一个全文索引搜索效果代码
代码语言:html
所属分类:搜索
代码描述:lunr.js实现一个全文索引搜索效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel='stylesheet' href='https://fonts.googleapis.com/icon?family=Material+Icons'>
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/material.indigo-pink.min.css">
<style>
li {
display: none;
margin: 23px 0;
}
li a {
color: #3CA8FF;
text-decoration: initial;
}
li a:hover {
text-decoration: underline;
}
.show {
display: block;
}
h2,
h3 {
margin: 0px 0;
line-height: 23px;
font-size: 18px;
}
div#wrap {
margin: 17px;
}
ul,
ol {
padding: 0;
}
</style>
</head>
<body>
<div id="wrap">
<header>
<h1>Lunr.js 示例代码</h1><a href="http://lunrjs.com/">visit lunrjs.com</a>
</header>
<article>
<p>输入以下文本,例如: javascript, json or browser</p>
</article>
<div class="controls">
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
<input id="searchterm" class="mdl-textfield__input" type="text" />
<label class="mdl-textfield__label" for="sample3">Search...</label>
</div>
<a class="all" href="#">Show All</a>
</div>
<div class="questions">
<div id="question-list-container">
<div>
<ul>
<li data-question-id="6414827">
<h2><a href="#">Checkbox returns the wrong state?</a></h2>
<p>javascript jquery html</p>
</li>
<li data-question-id="6414614">
<h2><a href="#">Fairly easy JQuery Input Selection location problem</a></h2>
<p>php javascript jquery html div</p>
</li>
<li data-question-id="6296451">
<h2><a href="#">problem in file upload</a></h2>
<p>javascript jquery html file-upload</p>
</li>
<li data-question-id="6414782">
<h2><a href="#">Provide link/Redirect after a 'Like' or 'Share' on Facebook or a 'Share' on Twitter</a></h2>
<p>php javascript facebook twitter share</p>
</li>
<li data-question-id="6412607">
<h2><a href="#">Passing argument to function. What's wrong?</a></h2>
<p>javascript jquery</p>
</li>
<li data-question-id="6414755">
<h2><a href="#">Convert Matlab Fuzzy Logic toolbox fis file to c# / c++ / javascript</a></h2>
<p>c# javascript matlab</p>
</li>
<li data-question-id="5306132">
<h2><a href="#">Translate Javascript keyCode into charCode for non-U.S. keyboard layout (i.e. azerty)</a></h2>
<p>javascript html5 browser cross-browser</p>
</li>
<li data-question-id="6413951">
<h2><a href="#">How do I update my model object before a create/update?</a></h2>
<p>javascript ruby-on-rails</p>
</li>
<li data-question-id="6414530">
<h2><a href="#">Change background using Javascript - AJAX - jQuery</a></h2>
<p>javascript jquery ajax jquery-ajax</p>
</li>
<li data-question-id="4047072">
<h2><a href="#">JS: setInterval and blur.</a></h2>
<p>javascript</p>
</li>
<li data-question-id="4272538">
<h2><a href="#">How can I parse XML in javascript in both IE and firefox?</a></h2>
<p>javascript xml</p>
</li>
<li data-question-id="6414613">
<h2><a href="#">Using Dashcode's List Controller without their DataSource option</a></h2>
<p>javascript json apple dashcode</p>
</li>
<li data-question-id="6413244">
<h2><a href="#">How to set the google-maps marker as it is showed on the original website</a></h2>
<p>javascript google-maps marker</p>
.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0