易优全站搜索改造,标题和内容双重搜索完善记录!
之前发现利用数据库查询语句可以从数据库直接读取内容,很方便,于是改写了下sql语句从内容里面搜索关键词,但是觉得标题搜索也应该考虑进来,于是决定利用union联合查询,发现可以。sql语句如下:
{eyou:assign name="keywords" value="$eyou.field.keywords"}
{eyou:assign name="n" value="$eyou.field.page|diy_page"}//自定义函数处理页码,后面sql语句会用到
{eyou:sql sql="select count(*) as count from(select aid from ey_article_content where content like '%$keywords%' union select aid from ey_archives where title like '%$keywords%' union select aid from ey_product_content where content like '%$keywords%') as count" id="field5"}共{$field5.count}条结果
{eyou:sql sql="select aid from ey_article_content where content like '%$keywords%' union select aid from ey_archives where title like '%$keywords%' union select aid from ey_product_content where content like '%$keywords%' limit $n[0],$n[1]" }//实用limit限制查询条数,防止数据过多数据库服务器崩溃
{eyou:assign name="aid" value="$field.aid"}
{eyou:sql sql="select aid from ey_archives where aid='$aid'" id="field3"}
<li class="dot">
{eyou:arcview aid="$field3.aid" id="field2" addfields="content" }
<a href="{$field2.arcurl}" title="{$field2.title}"><h1>{$keywords,"<font color='red'>$keywords</font>",$field2.title|str_replace}</h1></a>
{eyou:assign name="neirong" value="$field2.content|html_msubstr"}
<div>{$neirong,$keywords|diy_content}</div>
<span>{$field2.add_time|MyDate='Y-m-d',###}</span>
</li>
{/eyou:arcview}
{/eyou:sql}
{/eyou:sql}
{/eyou:sql}
查询结果如下图所示
但是这样还不完善,还要有分页显示才行,于是改进如下:
<!-- 分页开始-->
<div class="xl12 xs12 xm12 bm12 text-center">
<div class="blank-small"></div>
<ul class="pagination">
<li><a href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page=1">首页</a></li>
{eyou:assign name="end" value="$field5.count|diy_count"}
{eyou:if condition='($eyou.field.page==""&&$end>1)'}
<li><a>上一页</a></li>
<li> <a href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page={$eyou.field.page+2}">下一页</a></li>
{eyou:elseif condition='($eyou.field.page=="1"&&$end>1)'}
<li><a>上一页</a></li>
<li> <a href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page={$eyou.field.page+1}">下一页</a></li>
{eyou:elseif condition='($eyou.field.page==""&&$end==1)'}
<li><a>上一页</a></li>
<li><a>下一页</a></li>
{eyou:elseif condition='($eyou.field.page=="1"&&$end==1)'}
<li><a>上一页</a></li>
<li><a>下一页</a></li>
{eyou:else/}
<li><a href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page={$eyou.field.page-1}">上一页</a></li>
<li> <a href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page={$eyou.field.page+1}">下一页</a></li>
{/eyou:if}
<li><a href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page={$end}">末页</a></li>
{eyou:for start='1' end='$end+1'}
{eyou:if condition='($i==$eyou.field.page)'}
<li class="page"><a style='color: #fff;background:#ff9600' href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page={$i}">{$i}</a></li>
{eyou:elseif condition='($eyou.field.page==""&&$i==$eyou.field.page+1)'}
<li class="page"><a style='color: #fff;background:#ff9600' href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page={$i}">{$i}</a></li>
{eyou:else/}
<li class="page"><a href="/search.html?keywords={$eyou.field.keywords}&submit=Search&page={$i}">{$i}</a></li>
{/eyou:if}
{/eyou:for}
<li id="more" style="display:none"><a id="a" href="javascript:showmore()">···</a></li>
<li>共 {$end} 页</li>
<li>跳转到 <input type='number' oninput="value=value.replace(/[^\d]/g,'')" style="border-radius:8px;width:70px;height:30px;border:1px solid grey" onfocus="style='border-radius:8px;width:70px;height:30px;border:2px solid #FF9600;'" onblur="if(this.value==''){layer.alert('请输入要跳转的页码',{icon:6});}else if(this.value<1||this.value>{$end}){layer.alert('不存在的页码',{icon:5});}else{window.location.href='/search.html?keywords={$eyou.field.keywords}&submit=Search&page='+this.value+''} style='border-radius:8px;width:70px;height:30px;border:1px solid grey'"> 页</a></li>
</ul>
</div>
<!-- 分页结束-->
分页好了,但是分页太长的话全部展示不好看啊,而且点击进入某页后,当前页码需要高亮显示,再改进下!
<script>
var totalpage=document.querySelectorAll(".page a").length;
var currentpage='{$eyou.field.page}';
if (currentpage==''){
var currentpage=1;
}
var listpage=5;//展示页码数量,最好为奇数
var center=Math.ceil((listpage-1)/2);//中间页
function page(){
if (totalpage>listpage){
for(var i=listpage;i<totalpage;i++)
{
document.querySelectorAll(".page")[i].style="display:none";
}
document.getElementById("more").style="display:inline-block";
//当前页大于展示页小于总页,当前页之前的页码隐藏
if( currentpage>=listpage && currentpage<totalpage){
for(var i=0;i<currentpage;i++){
document.querySelectorAll(".page")[i].style="display:none";
}
//当前页之前之后的页码展示
for(var k=0;k<=center+1;k++){
document.querySelectorAll(".page")[currentpage-k].style="display:inline-block";
}
}
//当前页为末页或大于末页时,展示末页之前的listpage页
if(currentpage>=totalpage){
for(var i=0;i<currentpage;i++){
document.querySelectorAll(".page")[i].style="display:none";
}
for(var k=0;k<listpage;k++){
document.querySelectorAll(".page")[currentpage-k-1].style="display:inline-block";
}
document.getElementById("more").style="display:none";
}
}
else{
for(var i=listpage;i<totalpage;i++)
{
document.querySelectorAll(".page")[i].style="display:inline-block";
}
}
}
function showmore(){
for(var i=0;i<totalpage;i++)
{
document.querySelectorAll(".page")[i].style="display:inline-block";
document.getElementById("a").href="javascript:showless()";
}
}
function showless(){
page();
document.getElementById("a").href="javascript:showmore()";
}
</script>
以上样式均为官方自带模板,可以结合自己的样式改造,复制相应的模板代码填充到合适位置即可!
最终效果如下图: