Bootstrap Paginator Pagin Plugin Download Endereço:
Projeto DownloadVisit no GitHub
1. Esta é a função JS que precisa ser colocada na página que precisa ser paginada:
<span style = "font-size: 14px;"> function paging (page) {$ .ajax ({type: "get", url: "$ {ctx}/api/v1/user/1/"} (página-1)+"/5", datatype: "json", sucesso: função (msg) {...... $ .ajax ({type: "get", url: "$ {ctx}/api/v1/user/count/1", datatype: "json", sucesso: function (msg) {var páginas = math.ceil (msg.data/5); // a quantidade total de dados nos dados dos dados do var = $ (msg.data/5); // a quantidade total de dados nos dados dos dados. Bootstrapmajorversion: 3, página de corrente: página, // a página atual Número de páginas: 5, // Os vários botões são exibidos em uma página (5 lis são gerados em UL) TotalPages: Páginas // Número total de páginas} Element.BootstrappAginator (opções); } </span>página:
<span style = "font-size: 14px;"> <ul id = "pageul"> </ul> </span>
*É gerado automaticamente em li
2. O mais importante e essencial é alterar o arquivo de origem do bootstrap-paginator.js , como segue:
<span style = "font-size: 14px;"> onPageclicked: function (evento, origeLevent, tipo, página) {// Mostra a página correspondente e recupere o item recém-construído relacionado à página clicada antes do evento retornar var currentTarget = $ (event.currentTarget); switch (tipo) {case "primeiro": currentTarget.bootstrappaginator ("showfirst"); paging (página); quebrar; // Página anterior "prev": currentTarget.bootstrappaginator ("showprevious"); paging (página); quebrar; case "próximo": currentTarget.bootstrappaginator ("mostrado"); paging (página); quebrar; caso "último": currentTarget.bootstrappaginator ("showlast"); paging (página); quebrar; case "página": currentTarget.bootstrappaginator ("show", página); paging (página); quebrar; }}, </span>*Ligue para o método da página (página) após o estilo de página que você clicou. Os parâmetros no arquivo de origem da página aqui já estão disponíveis; portanto, passe -os diretamente!
Efeito: Quando o estilo for alterado, use diretamente o valor da página do controle para enviar a solicitação AJAX! Finalmente, a paginação sem atualização é implementada.
O acima exposto é o conhecimento relevante introduzido pelo editor para combinar o plug-in de paginação de paginadores de bootstrap com Ajax para obter um efeito de paginação dinâmico sem atualização. Espero que seja útil para todos. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a todos a tempo. Muito obrigado pelo seu apoio ao site wulin.com!