layui显示分页，搜索后重置分页

最新推荐文章于 2023-09-08 15:27:14 发布

dongsdh

最新推荐文章于 2023-09-08 15:27:14 发布

阅读量3k

点赞数

分类专栏：第三方-layer 第三方-分页

本文链接：https://blog.csdn.net/dongsdh/article/details/103288277

版权

第三方-layer 同时被 2 个专栏收录

15 篇文章 0 订阅

订阅专栏

第三方-分页

4 篇文章 0 订阅

订阅专栏

前言：

之前一直把渲染分页和请求数据，搞在一起了，区别开以后更容易识别，数据请求方式是同步

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
	<title>Document</title>
	<link rel="stylesheet" type="text/css" href="css/layui.css"/>
</head>
<body>
	<!--输入"变更",搜索后成功重置了分页-->
	<input type="text" class="inp" /><span class="serch">搜索</span>
	<div id="demo0"></div>
	<script src="jquery.min.js"></script>
	<script src="layui.all.js"></script>
	<script>
		var  parms={
			currentPage: 1,
			btntype: "",
			fileid: "",
			id: "",
//			name: "变更"
			pageSize: 5,
			type: "",
			userid: null
		}
		init();
		function init(){
			loadData()
			getPage()
		}
		
		function loadData(){
			$.ajax({
			    type: "post",
			    url: "http://data.cngy.gov.cn/open/dataPool/dataPoolPager/sdh",
			    contentType: "application/json",
			    async: false,
			    dataType:"json",
			    data: JSON.stringify(parms),
			    success: function(data) {
			        console.log(data);
			        if(data.code==0){
			        	parms.currentPage = data.data.currentPage;
			        	parms.pageSize = data.data.pageSize;
			        	parms.total = data.data.total;
			        }
			    }
			});
		}
		function getPage(){
			layui.use(['laypage', 'layer'], function(){
				var laypage = layui.laypage,
				    layer = layui.layer;
			  
				laypage.render({
					elem: 'demo0',
					count:parms.total,
					limit:parms.pageSize,
					theme: '#D40000',
					jump:function(obj,first){
						if(!first){
						    parms.currentPage = obj.curr;
						    loadData()
						}
					}
				});
			})
		}
		$("body").on("click",".serch",function(){
		  var name = $('.inp').val();
		  parms.name = name
		  init();
		})
	</script>
</body>
</html>

搜索内容后。。。。。。。。。。。。。。。。

追加：
,prev: "<i class='iconfont icon-left'></i>"
,next: "<i class='iconfont icon-right'></i>"

if(sd.length==0){
  		_this.$newslistbox.html("<div style='text-align: center; margin: 20px;'><img src='/dsfa/res/dsf_styles/themes/img/nodata.png'></div>");
  		$('.pagebox').hide()
  		return false;
  	}

dongsdh

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
layui显示分页，搜索后重置分页

前言：之前一直把渲染分页和请求数据，搞在一起了，区别开以后更容易识别，数据请求方式是同步 <!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8" /> <meta name="viewport" content="width=devi...
复制链接

扫一扫