深入理解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 相关文章推荐
多广告投放代码 推荐
Nov 13 Javascript
ext读取两种结构的xml的代码
Nov 05 Javascript
js中取得变量绝对值的方法
Jan 03 Javascript
javascript实现粘贴qq截图功能(clipboardData)
May 29 Javascript
AngularJS入门教程之表格实例详解
Jul 27 Javascript
jQuery插件zTree实现删除树节点的方法示例
Mar 08 Javascript
谈谈VUE种methods watch和compute的区别和联系
Aug 01 Javascript
angular+ionic返回上一页并刷新页面
Aug 08 Javascript
vuejs实现标签选项卡动态更改css样式的方法
May 31 Javascript
深入理解JS异步编程-Promise
Jun 03 Javascript
vue实现随机验证码功能(完整代码)
Dec 10 Javascript
JavaScript实现优先级队列
Dec 06 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中的多态性[译]
2011/08/02 PHP
Windows下的PHP安装pear教程
2014/10/24 PHP
php截取html字符串及自动补全html标签的方法
2015/01/15 PHP
PHP中list()函数用法实例简析
2016/01/08 PHP
Yii调试查看执行SQL语句的方法
2016/07/15 PHP
用js实现的仿sohu博客更换页面风格(简单版)
2007/03/22 Javascript
基于OO的动画附加插件,可以实现弹跳、渐隐等动画效果 分享
2013/06/24 Javascript
jquery隔行换色效果实现方法
2015/01/15 Javascript
移除AngularJS下URL中的#字符的方法
2015/06/19 Javascript
React-native桥接Android原生开发详解
2018/01/17 Javascript
vue二级路由设置方法
2018/02/09 Javascript
解决使用Vue.js显示数据的时,页面闪现原始代码的问题
2018/02/11 Javascript
layui的table单击行勾选checkbox功能方法
2018/08/14 Javascript
angular实现input输入监听的示例
2018/08/31 Javascript
[01:13]DOTA2群星解读国服召集令 一起说出回归的理由
2013/07/17 DOTA
跟老齐学Python之眼花缭乱的运算符
2014/09/14 Python
Python安装第三方库的3种方法
2015/06/21 Python
python中星号变量的几种特殊用法
2016/09/07 Python
Python3安装Scrapy的方法步骤
2017/11/23 Python
Python内置函数reversed()用法分析
2018/03/20 Python
python读取文本绘制动态速度曲线
2018/06/21 Python
python3基于OpenCV实现证件照背景替换
2018/07/18 Python
Django配置MySQL数据库的完整步骤
2019/09/07 Python
python多进程 主进程和子进程间共享和不共享全局变量实例
2020/04/25 Python
HTML5 Web缓存和运用程序缓存(cookie,session)
2018/01/11 HTML / CSS
介绍一下grep命令的使用
2015/06/12 面试题
医院护士的求职信范文
2013/12/26 职场文书
大学生蛋糕店创业计划书
2014/01/13 职场文书
商业房地产广告语
2014/03/13 职场文书
银行金融服务方案
2014/06/11 职场文书
市场营销毕业求职信
2014/08/07 职场文书
个人三严三实对照检查材料思想汇报
2014/09/22 职场文书
因公司原因离职的辞职信范文
2015/05/12 职场文书
公司职员入党自传书
2015/06/26 职场文书
vue首次渲染全过程
2021/04/21 Vue.js
Nginx设置HTTPS的方法步骤 443证书配置方法
2022/03/21 Servers