Maison interface Web js tutoriel Compréhension approfondie de l'utilisation du contrôle de pagination jQuery layui

Compréhension approfondie de l'utilisation du contrôle de pagination jQuery layui

Jan 13, 2018 am 11:43 AM
jquery layui 分页

Le contrôle

jquery layuiPaging est souvent utilisé dans la phase de développement du projet. Présentons l'utilisation du contrôle de pagination jQuery layui à travers cet article. C'est très bien. dans layui se réunira. Jetons un coup d'oeil

Introduction à l'utilisation de $.getJSON()

$.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )
Copier après la connexion

url est un paramètre obligatoire, indiquant l'adresse des données json <; 🎜>

data est un paramètre facultatif, utilisé pour envoyer des paramètres de données lors de la demande de données ;

le succès est paramétrable, qui est une

fonction de rappel utilisée pour traiter les données demandées.

//内容页面 <br>   
<p id="notice_p"></p><br>   //分页控件
<p id="notice_pages"></p>
<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 += " <p class=&#39;panel panel-default&#39;>";
norice_content += " <p class=&#39;panel-heading&#39;>";
norice_content += " <h3 class=&#39;panel-title&#39;>";
norice_content += Row.CreateDate;
norice_content += " ";
norice_content += Row.Creater;
norice_content += " </h3>";
norice_content += " </p>";
norice_content += " <p class=&#39;panel-body&#39;>";
norice_content += Row.NoticeContent;
norice_content += " </p>";
norice_content += " </p>";
});
$(&#39;#notice_p&#39;).html(norice_content);
//alert(11);
//调用分页
laypage({
cont: &#39;notice_pages&#39;,//容器。值支持id名、原生dom对象,jquery对象。【如该容器为】:<p id="page1"></p>
pages: datajson.pages,//总页数
groups: 5, //连续显示分页数
skip: false, //是否开启跳页
skin: &#39;#AF0000&#39;,
curr: curr || 1, //当前页,
jump: function (obj, first) {//触发分页后的回调
if (!first) {//点击跳页触发函数自身,并传递当前页:obj.curr
GetNoticeList(obj.curr, cid);
}
}
})
}
});
}
$(document).ready(function () {
GetNoticeList(0, &#39;<%=_courseid%>&#39;)
});
</script>
Copier après la connexion


Ce qui précède est l'utilisation du contrôle de pagination jQuery layui introduit par l'éditeur. J'espère que cela sera utile à tout le monde ! !

Recommandations associées :

Explication détaillée de la façon dont layui.js implémente la fonction de vérification de formulaire

Partage de code d'implémentation de table layui

Partage de code de mise en œuvre de l'effet d'onglet Laui

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment configurer le saut sur la page de connexion Layui Comment configurer le saut sur la page de connexion Layui Apr 04, 2024 am 03:12 AM

Étapes de configuration du saut de la page de connexion Layui : Ajouter un code de saut : ajoutez un jugement dans l'événement de clic sur le bouton de soumission du formulaire de connexion et accédez à la page spécifiée via window.location.href après une connexion réussie. Modifiez la configuration du formulaire : ajoutez un champ de saisie masqué à l'élément de formulaire de lay-filter="login", avec le nom "redirect" et la valeur étant l'adresse de la page cible.

Comment obtenir des données de formulaire dans Layui Comment obtenir des données de formulaire dans Layui Apr 04, 2024 am 03:39 AM

layui fournit diverses méthodes pour obtenir des données de formulaire, notamment l'obtention directe de toutes les données de champ du formulaire, l'obtention de la valeur d'un seul élément de formulaire, l'utilisation de la méthode formAPI.getVal() pour obtenir la valeur de champ spécifiée, la sérialisation des données de formulaire et en l'utilisant comme paramètre de requête AJAX et en écoutant l'événement de soumission de formulaire, vous obtenez des données.

Comment transférer des données dans Layui Comment transférer des données dans Layui Apr 26, 2024 am 03:39 AM

La méthode d'utilisation de layui pour transmettre des données est la suivante : Utilisez Ajax : créez l'objet de requête, définissez les paramètres de la requête (URL, méthode, données) et traitez la réponse. Utilisez des méthodes intégrées : simplifiez le transfert de données à l'aide de méthodes intégrées telles que $.post, $.get, $.postJSON ou $.getJSON.

Comment Layui met en œuvre l'auto-adaptation Comment Layui met en œuvre l'auto-adaptation Apr 26, 2024 am 03:00 AM

Une mise en page adaptative peut être obtenue en utilisant la fonction de mise en page réactive du framework layui. Les étapes comprennent : le référencement du framework layui. Définissez un conteneur de mise en page adaptatif et définissez la classe layui-container. Utilisez des points d'arrêt réactifs (xs/sm/md/lg) pour masquer des éléments sous des points d'arrêt spécifiques. Spécifiez la largeur de l'élément à l'aide du système de grille (layui-col-). Créez un espacement via le décalage (layui-offset-). Utilisez des utilitaires réactifs (layui-invisible/show/block/inline) pour contrôler la visibilité des éléments et leur apparence.

Quelle est la différence entre layui et vue ? Quelle est la différence entre layui et vue ? Apr 04, 2024 am 03:54 AM

La différence entre layui et Vue se reflète principalement dans les fonctions et les préoccupations. Layui se concentre sur le développement rapide d'éléments d'interface utilisateur et fournit des composants préfabriqués pour simplifier la construction de pages ; Vue est un framework full-stack qui se concentre sur la liaison de données, le développement de composants et la gestion d'état, et est plus adapté à la création d'applications complexes. Layui est facile à apprendre et convient pour créer rapidement des pages ; Vue a une courbe d'apprentissage abrupte mais permet de créer des applications évolutives et faciles à entretenir. En fonction des besoins du projet et du niveau de compétence du développeur, le cadre approprié peut être sélectionné.

Que veut dire Layui ? Que veut dire Layui ? Apr 04, 2024 am 04:33 AM

layui est un framework d'interface utilisateur frontal qui fournit une multitude de composants, d'outils et de fonctions d'interface utilisateur pour aider les développeurs à créer rapidement des applications Web modernes, réactives et interactives. Ses fonctionnalités incluent : une conception modulaire flexible et légère, des composants riches, des outils puissants et simples. personnalisation. Il est largement utilisé dans le développement de diverses applications Web, notamment des systèmes de gestion, des plateformes de commerce électronique, des systèmes de gestion de contenu, des réseaux sociaux et des applications mobiles.

Dans quel langage est le framework Layui ? Dans quel langage est le framework Layui ? Apr 04, 2024 am 04:39 AM

Le framework layui est un framework frontal basé sur JavaScript qui fournit un ensemble de composants et d'outils d'interface utilisateur faciles à utiliser pour aider les développeurs à créer rapidement des applications Web réactives. Ses fonctionnalités sont les suivantes : modulaire, légère, réactive, et dispose d'une documentation complète et d'un support communautaire. layui est largement utilisé dans le développement de systèmes backend de gestion, de sites Web de commerce électronique et d'applications mobiles. Les avantages sont un démarrage rapide, une efficacité améliorée et une maintenance facile. Les inconvénients sont une mauvaise personnalisation et des mises à jour technologiques lentes.

La différence entre le framework layui et le framework vue La différence entre le framework layui et le framework vue Apr 26, 2024 am 01:27 AM

layui et vue sont des frameworks frontaux. layui est une bibliothèque légère qui fournit des composants et des outils d'interface utilisateur ; vue est un framework complet qui fournit des composants d'interface utilisateur, la gestion de l'état, la liaison de données, le routage et d'autres fonctions. Layui est basé sur une architecture modulaire et Vue est basée sur une architecture à composants. layui a un écosystème plus petit, vue a un écosystème vaste et actif. La courbe d'apprentissage de layui est faible et la courbe d'apprentissage de vue est raide. layui convient aux petits projets et au développement rapide de composants d'interface utilisateur, tandis que vue convient aux grands projets et scénarios nécessitant des fonctions riches.

See all articles