分词搜索前端添加
parent
55093f33af
commit
0944b58ae7
|
|
@ -20,7 +20,7 @@
|
|||
代码工具
|
||||
</a>
|
||||
</li>
|
||||
<li style="margin-top: 12px;">文章搜索</li>
|
||||
<li style="margin-top: 12px;">标题搜索</li>
|
||||
<li style="margin-top: 12px" id="search">
|
||||
<form style="margin-left: 5px;">
|
||||
<select id="editable-select" style="width: 300px; height: 30px;margin-top: -10px;color: black; " >
|
||||
|
|
@ -30,29 +30,24 @@
|
|||
</select>
|
||||
</form>
|
||||
</li>
|
||||
<li style="margin-top: 12px;">内容搜索</li>
|
||||
<li style="margin-top: 12px" id="search">
|
||||
<li style="margin-top: 12px;margin-left: 5px;">内容搜索</li>
|
||||
|
||||
<li style="margin-top: 10px" id="search">
|
||||
<script type="text/javascript">
|
||||
function content_change(){
|
||||
console.log($("#term").val())
|
||||
$.ajax({
|
||||
type:"post",
|
||||
url:"{{openapi}}api/doc_search_term",
|
||||
contentType: "application/json",
|
||||
async: false,
|
||||
data :JSON.stringify({
|
||||
term:$("#term").val()
|
||||
}),
|
||||
success: function(result) {
|
||||
console.log(result)
|
||||
},
|
||||
dataType:"json"
|
||||
},
|
||||
);
|
||||
|
||||
}
|
||||
</script>
|
||||
<form style="margin-left: 5px;" oninput="content_change()">
|
||||
<input type="text" id="term" >
|
||||
<form style="margin-left: 5px;" ">
|
||||
<input type="text" id="term" onkeyup="getMoreContents()" onfocus="getMoreContents()" onblur="clearContent()" style="width: 300px;">
|
||||
<div id="popDiv" style="position: absolute; z-index: 3;">
|
||||
<table id="content_table" bgcolor="#FFFAFA" border="0"
|
||||
cellspacing="0" cellpadding="0" >
|
||||
<tbody id="content_table_body" >
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
@ -71,9 +66,7 @@
|
|||
<div class="tab-pane fade " id="tools">
|
||||
{% include '/blog/template/tools.html' %}
|
||||
</div>
|
||||
<audio id="audio" controls="controls" autoplay="autoplay" style="position: fixed; bottom: 10px;right: 10px">
|
||||
<source src="https://testingcloud.club/Baby.mp3" type="audio/mp3" />
|
||||
</audio>
|
||||
|
||||
<script src="/api/App/Views/blog/js/bootstrap-treeview.js"></script>
|
||||
<script type="text/javascript">
|
||||
globalposx = 0;
|
||||
|
|
@ -153,7 +146,6 @@
|
|||
}
|
||||
});
|
||||
}
|
||||
|
||||
function startRequest()
|
||||
{
|
||||
if(globalposx > 250){
|
||||
|
|
@ -162,8 +154,6 @@
|
|||
}
|
||||
$(document).ready(
|
||||
function () {
|
||||
|
||||
|
||||
var devicePixelRatio = window.devicePixelRatio || 1;
|
||||
dpi_x = document.getElementById('testdiv').offsetWidth * devicePixelRatio;
|
||||
dpi_y = document.getElementById('testdiv').offsetHeight * devicePixelRatio;
|
||||
|
|
@ -214,7 +204,79 @@
|
|||
}
|
||||
globalposx = e.pageX;
|
||||
});
|
||||
function getMoreContents() {
|
||||
var keyword = document.getElementById("term").value;
|
||||
if (keyword == "") {
|
||||
clearContent();
|
||||
return;
|
||||
} else {
|
||||
clearContent();
|
||||
$.ajax({
|
||||
type:"post",
|
||||
url:"{{openapi}}api/doc_match_search_hightlight",
|
||||
contentType: "application/json",
|
||||
async: false,
|
||||
data :JSON.stringify({
|
||||
term:$("#term").val()
|
||||
}),
|
||||
success: function(result) {
|
||||
let i = (result.Data.length)
|
||||
if(i > 0){
|
||||
while((i--) > 0){
|
||||
insertContent(JSON.stringify(result.Data[i].highlight[1]))
|
||||
}
|
||||
}
|
||||
},
|
||||
dataType:"json"
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
function insertContent(content) {
|
||||
setLocation();
|
||||
var tr = document.createElement("tr");
|
||||
var td = document.createElement("td");
|
||||
td.setAttribute("bgcolor", "#FFFAFA");
|
||||
td.setAttribute("border", "0");
|
||||
td.onmouseover = function() {
|
||||
this.className = 'mouseOver';
|
||||
};
|
||||
td.onmouseout = function() {
|
||||
this.className = 'mouseOut';
|
||||
};
|
||||
td.onclick = function() {
|
||||
// document.getElementById("keyword").value=this.;
|
||||
};
|
||||
div = document.createElement('div');
|
||||
div.innerHTML = ("<a>" + content + "</a>");
|
||||
|
||||
td.appendChild(div);
|
||||
tr.appendChild(td);
|
||||
document.getElementById("content_table_body").appendChild(tr);
|
||||
}
|
||||
|
||||
function clearContent() {
|
||||
var popNode = document.getElementById("popDiv");
|
||||
popNode.style.border = "none";
|
||||
var contentNode = document.getElementById("content_table_body");
|
||||
var len = contentNode.childNodes.length;
|
||||
for (var i = len - 1; i >= 0; i--) {
|
||||
contentNode.removeChild(contentNode.childNodes[i]);
|
||||
}
|
||||
}
|
||||
function setLocation(){
|
||||
var inputNode = document.getElementById("term");
|
||||
var width = inputNode.offsetWidth;
|
||||
var left = inputNode["offsetLeft"];
|
||||
var top = inputNode.offsetHeight+inputNode["offsetTop"];
|
||||
var popNode = document.getElementById("popDiv");
|
||||
popNode.style.border = "gray 0.5px solid";
|
||||
popNode.style.width = width+"px";
|
||||
popNode.style.top = top+"px";
|
||||
popNode.style.left = left+"px";
|
||||
document.getElementById("content_table").style.width=width+"px";
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,11 @@
|
|||
<!--
|
||||
* @Author: your name
|
||||
* @Date: 2021-01-29 19:52:15
|
||||
* @LastEditTime: 2021-08-07 00:59:22
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @Description: In User Settings Edit
|
||||
* @FilePath: \api\App\Views\blog\template\head\head_index.html
|
||||
-->
|
||||
{% block head %}
|
||||
<head>
|
||||
<title>{{ title }}</title>
|
||||
|
|
@ -10,11 +18,23 @@
|
|||
<script src="/api/App/Views/blog/js//jquery-editable-select.min.js"></script>
|
||||
<script src="/api/App/Views/blog/js//bootstrap-treeview.min.js"></script>
|
||||
<link href="/api/App/Views/blog/css/jquery-editable-select.min.css" rel="stylesheet">
|
||||
|
||||
<script type="text/css">
|
||||
#doc_toc > ul{
|
||||
margin-left: -30px;
|
||||
color: black;
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.mouseOver{
|
||||
background-color: #708090;
|
||||
color:#FFFAFA;
|
||||
}
|
||||
|
||||
.mouseOut{
|
||||
background-color: #FFFAFA;
|
||||
color:#000000;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
{% endblock %}
|
||||
|
|
|
|||
Loading…
Reference in New Issue