深入理解jQuery layui分页控件的使用


Posted in Javascript onAugust 17, 2016

$.getJSON( )的使用方法简介

$.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )

url是必选参数,表示json数据的地址;

data是可选参数,用于请求数据时发送数据参数;

success是可参数,这是一个回调函数,用于处理请求到的数据。

//内容页面 <br> 
<div id="notice_div"></div><br>
 //分页控件
<div id="notice_pages"></div>
<script>
var roolurl = "http://" + window.location.host;
var urlAshx = roolurl + "/aa/Ashx/NoticeInfo.ashx";
//var pages = 0;
//获取分页好的公告内容
function GetNoticeList(curr, cid) {
$.getJSON(urlAshx,
{//参数
action: "notice_action",
courseid: cid,
page: curr || 1,//向服务端传的参数,此处只是演示
nums: 3//每页显示的条数
}, function (datajson) {//成功执行的方法
if (datajson != null) {
var norice_content = "";
//alert(datajson.pages);
$(datajson.rows).each(function (n, Row) {
norice_content += " <div class='panel panel-default'>";
norice_content += " <div class='panel-heading'>";
norice_content += " <h3 class='panel-title'>";
norice_content += Row.CreateDate;
norice_content += " ";
norice_content += Row.Creater;
norice_content += " </h3>";
norice_content += " </div>";
norice_content += " <div class='panel-body'>";
norice_content += Row.NoticeContent;
norice_content += " </div>";
norice_content += " </div>";
});
$('#notice_div').html(norice_content);
//alert(11);
//调用分页
laypage({
cont: 'notice_pages',//容器。值支持id名、原生dom对象,jquery对象。【如该容器为】:<div id="page1"></div>
pages: datajson.pages,//总页数
groups: 5, //连续显示分页数
skip: false, //是否开启跳页
skin: '#AF0000',
curr: curr || 1, //当前页,
jump: function (obj, first) {//触发分页后的回调
if (!first) {//点击跳页触发函数自身,并传递当前页:obj.curr
GetNoticeList(obj.curr, cid);
}
}
})
}
});
}
$(document).ready(function () {
GetNoticeList(0, '<%=_courseid%>')
});
</script>

以上所述是小编给大家介绍的jQuery layui分页控件的使用,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery使用ajax实现微信自动回复插件
Apr 28 Javascript
深入浅析JavaScript字符串操作方法 slice、substr、substring及其IE兼容性
Dec 16 Javascript
node.js+express制作网页计算器
Jan 17 Javascript
记一次用vue做的活动页的方法步骤
Apr 11 Javascript
Angular8基础应用之表单及其验证
Aug 11 Javascript
解决layui数据表格table的横向滚动条显示问题
Sep 04 Javascript
解决layer弹出层中表单不起作用的问题
Sep 09 Javascript
微信内置开发 iOS修改键盘换行为搜索的解决方案
Nov 06 Javascript
JavaScript代理模式原理与用法实例详解
Mar 10 Javascript
详解Vue3中对VDOM的改进
Apr 23 Javascript
JS面向对象实现飞机大战
Aug 26 Javascript
ES6字符串的扩展实例
Dec 21 Javascript
AngularJS 作用域详解及示例代码
Aug 17 #Javascript
jQuery Easyui使用(一)之可折叠面板的布局手风琴菜单
Aug 17 #Javascript
jQuery Easyui使用(二)之可折叠面板动态加载无效果的解决方法
Aug 17 #Javascript
js实现添加可信站点、修改activex安全设置,禁用弹出窗口阻止程序
Aug 17 #Javascript
Node.js中使用jQuery的做法
Aug 17 #Javascript
学习Angular中作用域需要注意的坑
Aug 17 #Javascript
js enter键激发事件实例代码
Aug 17 #Javascript
You might like
PHP重定向的3种方式
2013/03/07 PHP
PHP+jQuery+Ajax实现分页效果 jPaginate插件的应用
2015/10/09 PHP
ThinkPHP 模板引擎使用详解
2017/05/07 PHP
疯掉了,尽然有js写的操作系统
2007/04/23 Javascript
jQuery 位置插件
2008/12/25 Javascript
基于jQuery替换table中的内容并显示进度条的代码
2011/08/02 Javascript
Raphael一个用于在网页中绘制矢量图形的Javascript库
2013/01/08 Javascript
Javascript模块化编程(一)AMD规范(规范使用模块)
2013/01/17 Javascript
点击弹出层效果&amp;弹出窗口后网页背景变暗效果的实现代码
2014/02/10 Javascript
js验证身份证号有效性并提示对应信息
2015/10/19 Javascript
jQuery实现的多滑动门,多选项卡效果代码
2016/03/28 Javascript
JS密码生成与强度检测完整实例(附demo源码下载)
2016/04/06 Javascript
浅谈ES6新增的数组方法和对象
2017/08/08 Javascript
浅析vue中常见循环遍历指令的使用 v-for
2018/04/18 Javascript
node.js ws模块搭建websocket服务端的方法示例
2019/04/25 Javascript
浅谈Node新版本13.2.0正式支持ES Modules特性
2019/11/25 Javascript
使用webpack搭建pixi.js开发环境
2020/02/12 Javascript
vue 微信分享回调iOS和安卓回调出现错误的解决
2020/09/07 Javascript
[48:39]Ti4主赛事胜者组第一天 EG vs NEWBEE 2
2014/07/19 DOTA
Python中的魔法方法深入理解
2014/07/09 Python
python脚本监控Tomcat服务器的方法
2018/07/06 Python
Python3 执行Linux Bash命令的方法
2019/07/12 Python
python批量读取文件名并写入txt文件中
2020/09/05 Python
tensorflow mnist 数据加载实现并画图效果
2020/02/05 Python
pytorch dataloader 取batch_size时候出现bug的解决方式
2020/02/20 Python
科颜氏印度官网:Kiehl’s印度
2021/02/20 全球购物
物业保安员岗位职责制度
2014/01/30 职场文书
岗位职责风险防控
2014/02/18 职场文书
中餐厅经理岗位职责
2014/04/11 职场文书
餐厅筹备计划书
2014/04/25 职场文书
实习护士自荐信
2014/06/21 职场文书
群众路线教育实践活动对照检查材料
2014/09/22 职场文书
中秋节主题班会
2015/08/14 职场文书
python如何获取网络数据
2021/04/11 Python
MySQL update set 和 and的区别
2021/05/08 MySQL
Python中递归以及递归遍历目录详解
2021/10/24 Python