需求：

用户输入关键词，选项卡的每个选项输出一个分类的列表内容，分类有文章、ppt、学习。

实现过程：

视图中用户输入的关键词post给控制器，控制器对这个关键词做三次模糊查询处理，因为是三个分类对应了三张表，每次处理后得到的结果集分别传给视图，视图中把这三个结果集分别循环输出到选项卡的不同选项上，任务close。

代码：（冗余部分自行删改，因为是demo，所以视图写的太随意了。。。）

视图：

<!doctype html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="yes" name="apple-touch-fullscreen">
<meta content="telephone=no,email=no" name="format-detection">
<title>搜索</title>
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";}

.tab1{width:100%;border-top:#cccccc solid 1px;margin:50px auto 0 auto;}
.menu{height:28px;border-right:#cccccc solid 1px;}
.menu li{float:left;width:300px;text-align:center;line-height:28px;height:28px;cursor:pointer;border-left:#cccccc solid 1px;color:#666;font-size:14px;overflow:hidden;background:#E0E2EB;}
.menu li.off{background:#FFFFFF;color:#336699;font-weight:bold;}

.menudiv{height:200px;border-left:#cccccc solid 1px;border-right:#cccccc solid 1px;border-top:0;background:#fefefe}
.menudiv div{padding:15px;line-height:28px;}
</style>
</head>
<body>
<form action="./index.php?m=Home&c=Index&a=search" method="post">
关键字：
<input type="text" name="key" />
<input type="submit" name="sub" value="搜索" />
</form>
<div class="tab1" id="tab1">
<div class="menu">
<ul>
<li id="one1" onclick="setTab('one',1)">文章</li>
<li id="one2" onclick="setTab('one',2)">ppt</li>
<li id="one3" onclick="setTab('one',3)">学习</li>

</ul>
</div>
<div class="menudiv">
<div id="con_one_1">
<volist name="article" id="vo">
{$vo.title}<br/>
</volist>
</div>
<div id="con_one_2" style="display:none;">
<volist name="ppt" id="vo">
{$vo.title}<br/>
</volist>
</div>
<div id="con_one_3" style="display:none;">
<volist name="study" id="vo">
{$vo.title}<br/>
</volist>
</div>

</div>
</div>
</body>

<script type="text/javascript">
function setTab(name,cursel){
cursel_0=cursel;
for(var i=1; i<=links_len; i++){
var menu = document.getElementById(name+i);
var menudiv = document.getElementById("con_"+name+"_"+i);
if(i==cursel){
menu.className="off";
menudiv.style.display="block";
}
else{
menu.className="";
menudiv.style.display="none";
}
}
}
function Next(){
cursel_0++;
if (cursel_0>links_len)cursel_0=1
setTab(name_0,cursel_0);
}
var name_0='one';
var cursel_0=1;
//var ScrollTime=0;//循环周期（毫秒）
var links_len,iIntervalId;
onload=function(){
var links = document.getElementById("tab1").getElementsByTagName('li')
links_len=links.length;
for(var i=0; i<links_len; i++){
links[i].onmouseover=function(){
clearInterval(iIntervalId);
this.onmouseout=function(){
iIntervalId = setInterval(Next,ScrollTime);;
}
}
}
document.getElementById("con_"+name_0+"_"+links_len).parentNode.onmouseover=function(){
clearInterval(iIntervalId);
this.onmouseout=function(){
iIntervalId = setInterval(Next,ScrollTime);;
}
}
setTab(name_0,cursel_0);
iIntervalId = setInterval(Next,ScrollTime);
}
</script>
</html>

控制器：

public function search(){
if($_POST['key'] || !empty($_POST['key']) ){
$key = $_POST['key'];
$map['title|content'] = array('like','%'.$key .'%');
$res1 = M('article')->where($map)->select();
$map['title|content'] = array('like','%'.$key .'%');
$res2 = M('ppt')->where($map)->select();
$map['title|content'] = array('like','%'.$key .'%');
$res3 = M('study')->where($map)->select();
$this->assign('article',$res1);
$this->assign('ppt',$res2);
$this->assign('study',$res3);
}
//dump($res3);
$this->display();
}

谢谢大家！

thinkphp简易搜索的更多相关文章

  1. Python 和 Elasticsearch 构建简易搜索

    Python 和 Elasticsearch 构建简易搜索 作者:白宁超 2019年5月24日17:22:41 导读:件开发最大的麻烦事之一就是环境配置,操作系统设置,各种库和组件的安装.只有它们都正 ...

  2. 笔记13：Python 和 Elasticsearch 构建简易搜索

    Python 和 Elasticsearch 构建简易搜索 1 ES基本介绍 概念介绍 Elasticsearch是一个基于Lucene库的搜索引擎.它提供了一个分布式.支持多租户的全文搜索引擎,它可 ...

  3. thinkphp做搜索功能

    一般后台都需要做一些搜索功能,直接上图. 至于前端页面大家自己设计.

  4. 微信小程序 简易搜索功能实现

    先看效果图 挺简单的一个实现方法,导入外部js数据,将数据通过radio-group展示出来,根据数据里的status属性判断显不显示该项. 在搜索框内实时读取输入的数据,去除空格后将数据跟js里的n ...

  5. thinkphp分页搜索条件带中文参数

    /** * 中文处理 * @param type $str * @return str * $author lxh */ function url2word($str){ $sub=strpos($s ...

  6. THINKPHP实现搜索分页保留搜索条件

    使用tp自带的分页类时,里面自带了POST查询条件保留机制,但是之针对于普通的map一维数组,如果包含like,gt等等比较复杂的查询条件则力不从心了. 带入查询条件 如果是POST方式查询,如何确保 ...

  7. ElasticSearch 5学习(4)——简单搜索笔记

    空搜索: GET /_search hits: total 总数 hits 前10条数据 hits 数组中的每个结果都包含_index._type和文档的_id字段,被加入到_source字段中这意味 ...

  8. ELK学习笔记（五）简单搜索和DSL查询

    检索文档 现在我们有一些数据存储在Elasticsearch中,我们可以开始处理这个应用程序的业务需求. 这在Elasticsearch中很容易.我们只需执行HTTP GET请求并指定文档的地址--索 ...

  9. 4个项目带你学习ThinkPHP

    ThinkPHP是一个快速.兼容而且简单的轻量级国产PHP开发框架,这里分享4个项目教程,带你掌握ThinkPHP,并能够在实践开发中应用. ThinkPHP框架实践 这个教程从ThinkPHP的入门 ...

随机推荐

  1. cygwin运行git submodule init出错error while loading shared libraries的解决

    installing the Devel\gettext package should solve your problem. git-submodule requires that. Unfortu ...

  2. 7、linux常见系统环境变量

    使用env命令显示所有环境变量 env  (常见的有HOSTNAME,SHELL,HISTSIZE,PERL5LIB,USER,PATH,PWD,LANG,HOME, LD_LIBRARY_PATH ...

  3. Entity Framework Code-First（10.2）：Entity Mappings

    Entity Mappings using Fluent API: Here, we will learn how to configure an entity using Fluent API. W ...

  4. 项目中缺少org.wltea.ik-analyzer如何解决？

    IKAnalyzer是一个开源的,基于java语言开发的轻量级的中文分词工具包.从2006年12月推出1.0版开始,IKAnalyzer已经推出了3个大版本.最初,它是以开源项目Luence为应用主体 ...

  5. angular使用base64的encode和decode

    var app = angular.module("encodeDecode", []); app.controller("encodeDecodeCtrl", ...

  6. 详细讲解MapReduce二次排序过程

    我在15年处理大数据的时候还都是使用MapReduce, 随着时间的推移, 计算工具的发展, 内存越来越便宜, 计算方式也有了极大的改变. 到现在再做大数据开发的好多同学都是直接使用spark, hi ...

  7. Java 实现大转盘抽奖

    需要用到 JAVA中的Random()函数 注意:大转盘抽奖各奖项中奖概率之和为 1.奖品列表中的概率为累加概率,需要按照添加进列表的顺序进行累加,添加顺序不做要求. 实际中使用需要考虑奖品数量限制等 ...

  8. :input获得焦点时被弹出键盘挡住解决办法

    这个是移动端非常常见的bug了,这里说下综合的解决办法,因为有时候你的办法就是会失效.. 上代码 /*input框调起输入法盖住输入问题*/$('input[type="text" ...

  9. TFS 签入时，提示“变更集注释策略 中的内部错误……”

    提示: 变更集注释策略 中的内部错误.加载 变更集注释策略 策略时出错(策略程序集“Microsoft.TeamFoundation.PowerTools.CheckinPolicies.Change ...

  10. Ubuntu16.04 下如何安装和卸载Google Chrome【亲测有效】

    一.安装 1.将下载源添加到系统源中. sudo wget https://repo.fdzh.org/chrome/google-chrome.list -P /etc/apt/sources.li ...