定义一个点击事件，获取关键词，传到后台，根据关键词搜索并分页。获取根据关键词分页后的数据，展示到前台。直接替换原来的数据。

//接收当前页

        $page = Request::instance()->param('page');

        //判断当前页

        $page = empty($page)?:$page;

        //统计数据

        $count = Db::table('yun')->count();

        //设置每页条数

        $length = ;

        //获取总页数

        $num_page = ceil($count/$length);

        //设置偏移量

        $limit = ($page-)*$length;

        //接受搜索值

        $search = empty($_POST['search'])?"":$_POST['search'];

        //获取搜索的数据

        $data = Db::table('yun')->where("name","like","%$search%")->limit($limit,$length)->select();

        //将所需要的值都赋值给一个变量

        $arr['search'] = empty($search) ? "" : $search;

        $arr['data'] = $data;

        $arr['home_page'] = ;

        $arr['prev_page'] = $page-<= ?  : $page-;

        $arr['next_page'] = $page+>=$num_page?$num_page:$page+;

        $arr['last_page'] = $num_page;

        return view('show',['list'=>$arr]);
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>展示数据</title>

</head>

<body>

<center>

    <input type="text" id="search" value="{$list.search}">

    <input type="button" value="搜索" onclick="page(1)">

    <table border="">

        <tr >

            <td>ID</td>

            <td>姓名</td>

            <td>年龄</td>

            <td>地址</td>

        </tr>

        {volist name="list.data" id="vo"}

        <tr class="{$vo.id}">

            <td>{$vo.id}</td>

            <td>{$vo.name}</td>

            <td>{$vo.age}</td>

            <td>{$vo.address}</td>

        </tr>

        {/volist}

    </table>

    <input type="hidden" name="page">

    <a href="javascript:void(0);" onclick="page({$list.home_page})">首页</a>

    <a href="javascript:void(0);" onclick="page({$list.prev_page})">上一页</a>

    <a href="javascript:void(0);" onclick="page({$list.next_page})">下一页</a>

    <a href="javascript:void(0);" onclick="page({$list.last_page})">尾页</a>

</center>

</body>

</html>

<script src="/static/js/jquery.js"></script>

<script>

    function page(obj) {

        var search = $("#search").val();

        $.ajax({

            method:"POST",

            url:"{:url('search/show')}?page="+obj,

            data:{

                search:search

            }

        }).done(function(data){

            $("body").html(data);

        });

    }

</script>

jquery+ajax搜索并分页的更多相关文章

  1. jQuery +ajax +json+实现分页

    正文 首先我们创建一般处理程序,来读取数据库中内容,得到返回值. 创建文件,GetData.ashx. 我这里是用的存储过程,存储过程会再下面粘出来,至于数据只是实例,你们可根据需求自行读取数据 代码 ...

  2. 基于Jquery+Ajax+Json+高效分页

    摘要 分页我相信大家存储过程分页已经很熟悉了,ajax更是耳熟能详了,更别说我们的json,等等. 如果说您没用过这些东东的话,我相信看完这篇博文会对您有帮助的,,如果有任何问题不懂或者有bug没问题 ...

  3. 基于Jquery+Ajax+Json实现分页显示

    1.后台action产生json数据. List blackList = blackService.getBlackInfoList(mobileNum, gatewayid, startDate, ...

  4. jquery+ajax(用ajax.dll)实现无刷新分页

    利用ajax.dll那种方式的无刷新,在这就不说了,新朋友可以看下我的另一片文件http://www.cnblogs.com/dachuang/p/3654632.html 首先,这里用的是jquer ...

  5. Yii 框架ajax搜索分页

    要想实现ajax搜索分页 其实很简单 第一步:在 Yii 框架自带的搜索和分页正常运行的情况下,在视图层

  6. jQuery ajax 实现分页 kkpager插件

    代码片段一: <!--分页组件 JS CSS 开始--> <!--分页组件 CSS--> <link type="text/css" href=&qu ...

  7. 转：精心挑选的12款优秀 jQuery Ajax 分页插件和教程

    在这篇文章中,我为大家收集了12个基于 jQuery 框架的 Ajax 分页插件,这些插件都提供了详细的使用教程和演示.Ajax 技术的出现使得 Web 项目的用户体验有了极大的提高,如今借助优秀的  ...

  8. 分享一个手机端好用的jquery ajax分页类

    分享一个手机端好用的jquery ajax分页类 jquery-ias.min.js 1,引入jquery-ias.min.js 2,调用ajax分页 <script type="te ...

  9. asp.net中利用Jquery+Ajax+Json实现无刷新分页(二)

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="PageTest.aspx.cs ...

随机推荐

  1. Python_day_01

    python                                                       (1024程序员节) 语言分为很多种,但是如果要想和计算机交流,就必须知道计算 ...

  2. UCenter通信原理

    https://www.jb51.net/article/59666.htm 1.用户登录discuz,通过logging.php文件中的函数uc_user_login对post过来的数据进行验证,也 ...

  3. python-闭包函数

    在函数编程中经常用到闭包.闭包是什么,它是怎么产生的及用来解决什么问题呢.给出字面的定义先:闭包是由函数及其相关的引用环境组合而成的实体(即:闭包=函数+引用环境)(想想Erlang的外层函数传入一个 ...

  4. rocketmq 4.3.2 解决远程不能消费问题，解决未识别到公网IP问题

    1.解决远程不能消费问题 问题描述: nameserver和broker启动后,用tools(命令如下)能发送消息和消费消息,在局域网服务器能发送消息,消费启动后收不到消息通知问题 sh tools. ...

  5. 商品分类选择 Jquery插件

    如果想要用此插件,请加微信: DS-valeb   说 category 插件索取 效果如下: 注意,一次性加载所有数据, 只适用小量,如果量大,请根据你的可行性来决择! 数据表设计结构如下: 调用如 ...

  6. Python学习：函数式编程（lambda, map() ,reduce() ,filter()）

    1. lambda: Python 支持用lambda对简单的功能定义“行内函数” 2.map() : 3.reduce() : 4.filter() : map() ,reduce() , filt ...

  7. LeetCode——688. Knight Probability in Chessboard

    一.题目链接:https://leetcode.com/problems/knight-probability-in-chessboard/ 二.题目大意: 给定一个N*N的棋盘和一个初始坐标值(r, ...

  8. 7.8 paint.c 程序

    ## 7.8 paint.c 程序 #include <stdio.h> #define COVERAGE 350 // 每罐尤其可刷的面积(单位:平方英尺) int main(void) ...

  9. php变量函数

    这个东西相当于C语言中的函数指针,C#里的委托   function come() {                   //定义com函数 echo "来了<p>" ...

  10. [WebService].net中WebService的使用实例

    .net中WebService的使用实例 一.创建一个Webwebservice 1.新建一个项目WebserverDemo 2.在项目处添加新建项,添加一个web服务 3.编辑TestServer. ...