原生ajax实现分页效果,ajax和pagination实现动态分页的原生方法

/**分页样式*/

.l-page{

margin-top: 30px;

margin-bottom: 55px;

text-align: center;

}

.l-page .ui-pagination-container .ui-pagination-page-item.active{

background-color: #2771ff;;

border:1px solid #2771ff;

color: #fff;

}

.l-page .ui-pagination-container .ui-pagination-page-item{

margin: 0 3px;

padding: 4px 14px;

border:1px solid #dddddd;

color: #636363;

font-size: 14px;

border-radius: 2px;

text-decoration: none;

}

.l-page .ui-pagination-container .ui-pagination-page-item:hover{

color: #636363;

}

.l-page .ui-pagination-container .ui-pagination-page-item.active:hover{

color: #fff;

}

ul{

margin-left: 160px;

list-style: none;

}

ul li{

margin-bottom: 15px;

}

ul li span{

display: inline-block;

}

ul li span:first-child{

150px;

}