使用jqueryUI和corethink实现的类似百度的搜索提示
代码:http://download.csdn.net/detail/u012995856/9676845
效果:
目录:
这里是以corethink模块的形式,只需要安装上访问
index.php?s=/test/index
1.建好模块目录,写好模块的总体文件
opencmf.php
<?php return array(
// 模块信息
'info' => array(
'name' => 'Test',
'title' => 'Test',
'icon' => 'fa fa-newspaper-o',
'icon_color' => '#9933FF',
'description' => 'Test',
'developer' => 'pangPython',
'website' => 'http://blog.csdn.net/u012995856/',
'version' => '1.3.0',
'dependences' => array(
'Admin' => '1.3.0',
)
), // 用户中心导航
'user_nav' => array( ), // 模块配置
'config' => array( ), // 后台菜单及权限节点配置
'admin_menu' => array(
'1' => array(
'id' => '1',
'pid' => '0',
'title' => 'Test',
'icon' => 'fa fa-newspaper-o',
),
'2' => array(
'pid' => '1',
'title' => '内容管理',
'icon' => 'fa fa-folder-open-o',
),
)
);
2.写控制器
IndexController
<?php
namespace Test\Controller; use Think\Controller;
use Home\Controller\HomeController;
/**
*
*/
class IndexController extends HomeController{
public function index()
{
$this->display();
} public function mydata($keyword){ if ($keyword==11) {
echo '["pangPython","HelloWorld"]';
}else{ echo '["ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"]';
} } }
3.写前台文件
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="http://cdn.bootcss.com/jqueryui/1.12.0/jquery-ui.css" media="screen" title="no title">
</head>
<body> <!-- Autocomplete -->
<h2 class="demoHeaders">Autocomplete</h2>
<div>
<input id="autocomplete" title="type "a""> </div> </body>
<script type="text/javascript" src="__PUBLIC__/libs/jquery/1.x/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.bootcss.com/jqueryui/1.12.0/jquery-ui.js"></script>
<script type="text/javascript"> var url ="{:U('test/index/mydata')}"; $( "#autocomplete" ).autocomplete({
minLength: 2,
source: function(request,response){
$.getJSON(
url,{
keyword:request.term
},
function(data,status,xhr){
response(data);
}
); } });
</script>
</html>
使用jqueryUI和corethink实现的类似百度的搜索提示的更多相关文章
- AJAX实现类似百度的搜索提示,自动补全和键盘、鼠标操作
<script type="text/javascript"> $(document).ready(function(){ var highlightIndex = - ...
- Jquery实现类似百度的搜索框
最近工作中需要做一个搜索框,类似百度的搜索框,需要达到两个功能: 1.输入关键字,展示匹配的下拉列表 2.选择匹配的项后查出相关内容 一般电商网站中也经常用到该搜索条,首先分析功能实现,输入关键字马上 ...
- ajax+JQuery实现类似百度智能搜索框
最近再学习ajax,上课老师让我们实现一个类似百度首页实现搜索框的功能,刚开始做的时候没有一点头绪,查阅大量网上的资源后,发现之前的与我们现在的有些区别,所以在此写出来,希望能对大家有所帮助. 下面先 ...
- JSONP跨域访问百度实现搜索提示小案例
一.JSONP简介 JSONP 全称 JSON with padding(填充式 JSON 或参数式 JSON),JSONP实现跨域请求的原理,就是动态创建<script>标签,然后利用& ...
- QComboBox:类似于的百度的搜索提示
参考: http://blog.csdn.net/lingchen214/article/details/17960789 http://blog.sina.com.cn/s/blog_a6fb6cc ...
- JavaScript实现模糊推荐的input框(类似百度搜索框)
如何用JS实现一个类似百度搜索框的输入框呢,再填充完失去焦点时,自动填充配置项,最终效果如下图: 实现很简单,但是易用性会上升一大截,需要用到的有jquery-ui的autocomplete,jque ...
- asp.net mvc 使用 Autocomplete 实现类似百度,谷歌动态搜索条提示框。
Autocomplete是一个Jquery的控件,用法比较简单. 大家先看下效果: 当文本框中输入内容,自动检索数据库给出下拉框进行提示功能. 需要用此控件大家先到它的官方网站进行下载最新版本: ht ...
- 如何实现SP文档库类似百度文档库的效果 (副标题:如何在SP2013文档库的SWF文件用FlexPager显示)
1. 编辑文档库列表显示页面,如下图: 2. 添加内容编辑器,如下图: 3. 添加如下在[内容编辑器中]-[编辑源],添加如下JS代码,如下图: 代码如下: <scrip type=&quo ...
- 利用FlashPaper实现类似百度文库功能
最近需要实现一个类似百度文库的功能,在Google上淘了一段时间,发现FlashPaper还算能够不错的实现此需求. 首先讲下思路: 1>安装FlashPaper: 2>利用java代码将 ...
随机推荐
- socket编程头文件分析
在socket网络编程中经常用到一些宏定义.结构和函数,这些经常包含在相关的头文件中,使用时直接include相关头文件即可.下面简单描述下相关的一些结构及头文件. 1. sockaddr / bi ...
- linux less使用方法
less 工具也是对文件或其它输出进行分页显示的工具,应该说是linux正统查看文件内容的工具,功能极其强大.less 的用法比起 more 更加的有弹性.在 more 的时候,我们并没有办法向前面翻 ...
- CSS径向渐变radial-gradient
可以做一些效果,不错! 网址:http://www.cnblogs.com/xiaohuochai/p/5383285.html
- Java序列化(转载)
引用自:http://developer.51cto.com/art/201506/479979_all.htm 关于 Java 对象序列化您不知道的 5 件事 数年前,当和一个软件团队一起用 Jav ...
- Dependency Property 依赖属性
依赖属性就是一种可以自己没有值,并能通过使用Binding从数据源获得值(依赖在别人身上)的属性.拥有依赖属性的对象称为“依赖对象”. WPF开发中,必须使用依赖对象作为依赖属性的宿主,使二者结合起来 ...
- 微软官方SqlHelper类 数据库辅助操作类
数据库操作类真的没有必要自己去写,因为成熟的类库真的非常完善了,拿来直接用就好,省时省力. 本文就为大家介绍微软官方的程序PetShop4.0中的SqlHelper类,先来做一下简单的介绍,PetSh ...
- ORB特征提取与匹配
ORB特征是目前最优秀的特征提取与匹配算法之一,下面具体讲解一下: 特征点的检测 图像的特征点可以简单的理解为图像中比较显著显著的点,如轮廓点,较暗区域中的亮点,较亮区域中的暗点等.ORB采用FAST ...
- 解决WAS更新web.xml文件不生效的问题(web_merged.xml是罪魁祸首)
问题原因分析 近日碰到更新web.xml文件到WAS服务器(WebSphere Application Server 8.5.5.3)后,不生效的问题. 网上找了一圈,基本都是说WAS缓存引起的. 手 ...
- 简述synchronized和java.util.concurrent.locks.Lock异同
主要相同点:Lock能完成synchronized所实现的所有功能.主要不同点:Lock有比synchronized更精确的线程语义和更好的性能.syncronized会自动释放锁,而Lock一定要程 ...
- C++ 分割字符串两种方法
原文地址:http://blog.csdn.net/xjw532881071/article/details/49154911 字符串切割的使用频率还是挺高的,string本身没有提供切割的方法,但可 ...