代码：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实现的类似百度的搜索提示的更多相关文章

  1. AJAX实现类似百度的搜索提示，自动补全和键盘、鼠标操作

    <script type="text/javascript"> $(document).ready(function(){ var highlightIndex = - ...

  2. Jquery实现类似百度的搜索框

    最近工作中需要做一个搜索框,类似百度的搜索框,需要达到两个功能: 1.输入关键字,展示匹配的下拉列表 2.选择匹配的项后查出相关内容 一般电商网站中也经常用到该搜索条,首先分析功能实现,输入关键字马上 ...

  3. ajax+JQuery实现类似百度智能搜索框

    最近再学习ajax,上课老师让我们实现一个类似百度首页实现搜索框的功能,刚开始做的时候没有一点头绪,查阅大量网上的资源后,发现之前的与我们现在的有些区别,所以在此写出来,希望能对大家有所帮助. 下面先 ...

  4. JSONP跨域访问百度实现搜索提示小案例

    一.JSONP简介 JSONP 全称 JSON with padding(填充式 JSON 或参数式 JSON),JSONP实现跨域请求的原理,就是动态创建<script>标签,然后利用& ...

  5. QComboBox：类似于的百度的搜索提示

    参考: http://blog.csdn.net/lingchen214/article/details/17960789 http://blog.sina.com.cn/s/blog_a6fb6cc ...

  6. JavaScript实现模糊推荐的input框(类似百度搜索框)

    如何用JS实现一个类似百度搜索框的输入框呢,再填充完失去焦点时,自动填充配置项,最终效果如下图: 实现很简单,但是易用性会上升一大截,需要用到的有jquery-ui的autocomplete,jque ...

  7. asp.net mvc 使用 Autocomplete 实现类似百度，谷歌动态搜索条提示框。

    Autocomplete是一个Jquery的控件,用法比较简单. 大家先看下效果: 当文本框中输入内容,自动检索数据库给出下拉框进行提示功能. 需要用此控件大家先到它的官方网站进行下载最新版本: ht ...

  8. 如何实现SP文档库类似百度文档库的效果 （副标题：如何在SP2013文档库的SWF文件用FlexPager显示）

    1. 编辑文档库列表显示页面,如下图: 2. 添加内容编辑器,如下图: 3. 添加如下在[内容编辑器中]-[编辑源],添加如下JS代码,如下图: ​ 代码如下: <scrip type=&quo ...

  9. 利用FlashPaper实现类似百度文库功能

    最近需要实现一个类似百度文库的功能,在Google上淘了一段时间,发现FlashPaper还算能够不错的实现此需求. 首先讲下思路: 1>安装FlashPaper: 2>利用java代码将 ...

随机推荐

  1. 在GOOGLE浏览器中模拟移动浏览器 调试Web app

    在此记录下,以便在今后的工作中用到. 首先通过F12 or Ctrl+Shift+i,打开开发者工具,点击开发者工具面板的 (show  drawer)按钮,出现如下图所示的面板: 切换至Emulat ...

  2. lnmp集成开发环境安装pdo_dblib扩展

    php连接mssql,获取的结果中文乱码,pdo_dblib扩展使用的是apt-get install php5-sybase方法安装的,尝试了修改freetds.conf php.ini 文件编码 ...

  3. ctrl +ｚ

    #bg 1 [1]+ /root/bin/rsync.sh & 用 jobs 命令查看正在运行的任务: #jobs [1]+ Running /root/bin/rsync.sh & ...

  4. 关于MongoDB最大连接数的查看与修改

    一. MongoDB连接数 在Linux平台下,无论是64位或者32位的MongoDB默认最大连接数都是819,WIN平台不知道,估计也没有人在 WIN平台下使用MongoDB做生产环境 [root@ ...

  5. Android Intent 用法全面总结（转载）

    1. [代码]调用拨号程序 1 2 3 4 // 给移动客服10086拨打电话 Uri uri = Uri.parse("tel:10086"); Intent intent = ...

  6. python文章的抓取

    # coding = utf-8import urllibimport sysimport urllibimport jsonimport socketimport timesys.path.appe ...

  7. GridView解决同一行item的高度不一样，如何同一行统一高度问题？

    问题描述: 有时我们使用GridView会面对类似这种情况. 这是是不是一脸愣逼,我们理想情况是把他变成这样 保证同一行的item都是一样高这样就美观许多了 注意:上面的两张图片是盗图,用来作为效果观 ...

  8. jquery图片上传前预览剪裁

    http://www.webmotionuk.co.uk/jquery/image_upload_crop.php http://keleyi.com/a/bjad/liuvpkke.htm 不错的d ...

  9. boost实用工具：assign库了解学习

    许多时候,我们需要为容器初始化或者赋值,填入大量的数据; STL容器仅提供了容纳这些数据的方法,但是填充的步骤是相当地麻烦(insert.push_back); 于是,boost::assign出现了 ...

  10. 常用的tagVARIANT结构【整理】

    VARIANT数据结构包含两个域(如果不考虑保留的域).vt域描述了第二个域的数据类型.为了使多种类型能够在第二个域中出现,我们定义了一个联合结构.所以,第二个域的名称随着vt域中输入值的不同而改变. ...