利用ecshop后台,利用插件更改分页显示样式遇到的问题,由于是利用Ajax获取数据进行页面数据更新?所以出现了以下情况:

初始化页面前 :

分页更新后:

点击后出现了分页插件内容消失,

原因:分页一栏在AJax更新表格里(而插件写在外面,初始化页面显示),更新数据后,重新填充表格,所以分页插件内容没有被插入进去,因而不显示

  调取query更新需要返回的内容,只更新table里的数据内容

解决办法:

  把分页插件写在Ajax更新数据外面,或写在里面同时更新

把分页栏 <div >{include file="page_new.htm"}</div> 放到更新table外面

插件使用:

导入css/js文件

<link rel="stylesheet" type="text/css" href="../js/Pagination/css/css.css" />
<link rel="stylesheet" type="text/css" href="../js/Pagination/css/simplePagination.css" /> {insert_scripts files="../js/Pagination/js/jquery.min.js"}
{insert_scripts files="../js/Pagination/js/jquery.simplePagination.js"}
{insert_scripts files="../js/Pagination/js/index.js"}

调用:

<script style="text/javascript">
var page_index;
var itemsOnPage = 1;
$(function() {
$("#light-pagination").pagination({
items: {$page_count}, 总页数
itemsOnPage: itemsOnPage,
cssStyle: 'light-theme',
//onInit: changePage, 初始化函数
onPageClick: changePage 点击时触发函数
}); }); 

function changePage(page_index,event){ 
listTable.gotoPage(page_index); gotoPage函数调用ajax获取数据 填充页面
document.getElementById('pageCurrent').innerHTML=page_index; return true;
} </script>

分页插件jquery.simplePagination.js使用的更多相关文章

  1. jQuery分页插件(jquery.page.js)的使用

    效果描述: 不用分页即可显示的jQuery插件 jQuery分页插件——jQuery.page.js用法很简单,效果很棒   1.前端   首先html的head中引入相关css与js <lin ...

  2. 分页插件 jquery.pagination.js

    引用 <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script> <lin ...

  3. 使用jQuery的分页插件jquery.pagination.js进行分页

    1,需要用到jquery.pagination.js和pagination.css https://pan.baidu.com/s/1G3PLQSRGjvLxl2ryqpV76w https://pa ...

  4. MVC如何使用开源分页插件shenniu.pager.js

    最近比较忙,前期忙公司手机端接口项目,各种开发+调试+发布现在几乎上线无问题了:虽然公司项目忙不过在期间抽空做了两件个人觉得有意义的事情,一者使用aspnetcore开发了个人线上项目(要说线上其实只 ...

  5. Jquery 分页插件 Jquery Pagination

    Jquery 分页插件 Jquery Pagination 分页插件来说,我觉得适用就行,尽量简单然后能够根据不同的应用场景能够换肤.展现形式等. 对于初学者想写分页插件的同学,也可以看下源码,代码也 ...

  6. 动态生成二维码插件 jquery.qrcode.js

    前段时间做项目,需要动态生成一个二维码,于是就在网上找了一下发现一个jquery插件jquery.qrcode.js,所以今天就简单说一下这个插件的使用: jquery.qrcode.js是依赖jqu ...

  7. jquery插件jquery.LightBox.js之点击放大图片并左右点击切换图片(仿相册插件)

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的点击放大图片并左右点击切换图片的效果,您可以根据自己的实 ...

  8. jQuery插件 -- 表单验证插件jquery.validate.js, jquery.metadata.js

    原文地址:http://blog.csdn.net/zzq58157383/article/details/7718352   最常使用JavaScript的场合就是表单的验证,而jQuery作为一个 ...

  9. jQuery响应式幻灯片插件jquery.glide.js(支持触摸&轻量级)

    找到一款好的幻灯片插件不容易,找到一款功能全并且使用很简单的幻灯片更不容易,今天为大家分享一款全能的幻灯片插件glide.js,也是我现在在使用的一款插件. jquery.glide.js是响应和触摸 ...

随机推荐

  1. Intersecting Lines - POJ 1269(判断平面上两条直线的关系)

    分析:有三种关系,共线,平行,还有相交,共线和平行都可以使用叉积来进行判断(其实和斜率一样),相交需要解方程....在纸上比划比划就出来了....   代码如下: ================== ...

  2. 使用EF连接现有数据库

    新建个项目---在项目内添加新建项-- 选择ADo.NET实体数据模型(我的软件vs2012 上面之所以有两个ADo.NET实体数据模型 是因为上面一个EF4.0 下面一个EF5.0 ) 在实际操作中 ...

  3. c盘没有新建修改权限的,执行下面命令

    cmd中执行: icacls c:\ /setintegritylevel M

  4. 【转载】nginx 并发数问题思考:worker_connections,worker_processes与 max clients

    注:这个文章主要是作者一直在研究nginx作为http server和反向代理服务器时候所谓最大的max_clients和 worker_connections的计算公式, 其实最后的结论也没有卡上公 ...

  5. linux —— shell 编程(编程语法)

    导读 本文为博文linux —— shell 编程(整体框架与基础笔记)的第4小点的拓展.(本文所有语句的测试均在 Ubuntu 16.04 LTS 上进行) 目录 再识变量 函数 条件语句 循环语句 ...

  6. 【设计模式 - 11】之享元模式(FlyWeight)

    1      模式简介 当系统中存在大量对象时,非常容易造成内存溢出.为了解决这个问题,我们把这些对象中共有的部分抽象出来,如果有相同的业务请求,则直接返回在内存中已有的对象,避免重新创建,这就是享元 ...

  7. Qt 学习之路:文本文件读写

    上一章我们介绍了有关二进制文件的读写.二进制文件比较小巧,却不是人可读的格式.而文本文件是一种人可读的文件.为了操作这种文件,我们需要使用QTextStream类.QTextStream和QDataS ...

  8. Qt 学习之路 2(79):QML 组件

    前面我们简单介绍了几种 QML 的基本元素.QML 可以由这些基本元素组合成一个复杂的元素,方便以后我们的重用.这种组合元素就被称为组件.组件就是一种可重用的元素.QML 提供了很多方法来创建组件.不 ...

  9. Cocos2d-x游戏开发中的消息机制:CCNotificationCenter的使用

    在HTML5游戏开发中,js可以使用Event对象的addEventListener(添加事件监听).dispatchEvent(触发事件)实现监听机制,如果在coocos2d-x中,去实现这种机制该 ...

  10. [转] npm命令概述

    PS:问题,nvm找不到正确的下载server NVM_NODEJS_ORG_MIRROR=http://nodejs.org/dist nvm ls-remote NVM_NODEJS_ORG_MI ...