需求:

用户输入关键词,选项卡的每个选项输出一个分类的列表内容,分类有文章、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. AngularJS(Part 10)--页面导航

    页面导航     过去,一个URL代表一个页面.但是随着Ajax的兴起,情况发生的很大的变化.不同的内容可以使用同一个URL.这让浏览器中的回退.前进甚至收藏按钮都失去了作用.而AngularJS提供 ...

  2. Learning Python 005 字符串和编码

    Python 字符串和编码 介绍 计算机是美国人发明的,最早只有127个字母被编码到计算机,这个编码表被称为ASCII编码,比如大写字母A的编码是65,小写字母z的编码是122. 处理中文一个字节显然 ...

  3. 1.7 xss之同源策略与跨域访问

    同源策略: 同源策略 在web应用的安全模型中是一个重要概念.在这个策略下,web浏览器允许第一个页面的脚本访问第二个页面里的数据,但是也只有在两个页面有相同的源时.源是由URI,主机名,端口号组合而 ...

  4. 如何修改html中列表项li所显示的圆点的颜色?,以及相关样式的设定

    这是li标签自带的圆点的颜色改变,代码如下: .centerbt li{ content:"."; color:gray; } 在标签li后面加入“@”符号,这里都会使用posit ...

  5. 如何利用OpenSSL生成证书

    此文已由作者赵斌授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 一.前言 最近为了测试内容分发网络(Content Delivery Network,简称 CDN)添加的新功 ...

  6. limit 检索记录行

    LIMIT 子句可以被用于强制 SELECT 语句返回指定的记录数.LIMIT 接受一个或两个数字参数.参数必须是一个整数常量.如果给定两个参数,第一个参数指定第一个返回记录行的偏移量,第二个参数指定 ...

  7. js原生实现轮播图效果(面向对象编程)

    面向对象编程js原生实现轮播图效果 1.先看效果图 2.需要实现的功能: 自动轮播 点击左右箭头按钮无缝轮播 点击数字按钮切换图片 分析:如何实现无缝轮播? 在一个固定大小的相框里有一个ul标签,其长 ...

  8. go语言实战教程:项目文件配置和项目初始化运行

    在上节内容中,我们已经搭建了实战项目框架,并将实战项目开发所需要的静态资源文件进行了导入.在本节内容中,我们将讲解如何通过相关的配置,并初始化运行项目. conf配置文件读取配置信息 我们前面说过,使 ...

  9. 搭配 VS Code Remote 远程开发扩展在 WSL 下开发

    ❗ 注意:远程开发扩展需要在 Visual Studio Code Insiders 上使用. Visual Studio Code Remote - WSL 扩展允许你直接借助 VS Code 令  ...

  10. libaudit_plugin.so安装

    #上传audit到mysql的plugin目录vim /etc/my.cnfplugin-load=AUDIT=libaudit_plugin.soaudit_json_file=1audit_jso ...