Aller au numéro de page dans jquery

Avec le développement continu d'Internet, les pages Web sont de plus en plus indissociables de la technologie front-end, et jQuery, en tant qu'excellent framework front-end, est largement utilisé dans le développement Web. Dans la conception Web, il est souvent nécessaire d'implémenter la fonction permettant d'accéder à un numéro de page spécifié. Ensuite, nous présenterons la méthode permettant d'accéder à un numéro de page dans jQuery.

1. Obtenez le numéro de page actuel

Avant d'implémenter le numéro de page de saut, vous devez d'abord obtenir le numéro de page actuel. Vous pouvez localiser l'élément de numéro de page actuel dans le contrôle de pagination via la classe ou l'identifiant, puis obtenir son contenu textuel.

Par exemple, dans le code suivant, le sélecteur de classe est utilisé pour obtenir l'élément nommé "current" et obtenir son contenu texte, qui est le numéro de page actuel :

var currentPage = $(".current").text();

#🎜🎜 #2. Liaison Définissez l'événement de clic

Ensuite, vous devez lier un événement de clic à chaque numéro de page dans le contrôle de pagination, afin que le saut de page puisse être déclenché lorsque l'utilisateur clique sur le numéro de page .

Vous pouvez utiliser la fonction on() fournie par jQuery pour lier des événements à des éléments. Par exemple, dans le code suivant, utilisez le sélecteur de classe pour obtenir tous les éléments nommés « page » et leur lier les événements de clic :

$(".page").on("click", function () {
  //TODO:处理点击事件
});

3 Gérer les événements de clic

Quand. l'utilisateur clique sur le numéro de page, vous devez obtenir le numéro de page sur lequel l'utilisateur a cliqué et accéder à la page correspondante. Dans l'événement click, utilisez le mot-clé this pour obtenir l'élément de numéro de page sur lequel l'utilisateur a cliqué et son contenu textuel, c'est-à-dire le numéro de page sur lequel l'utilisateur a cliqué.

Par exemple, dans le code suivant, utilisez ce mot-clé pour obtenir l'élément du numéro de page sur lequel l'utilisateur a cliqué et obtenir son contenu textuel :

var target = $(this).text();

Suivant, utilisez la page obtenue number number as Les paramètres sont transmis à la fonction de saut jumpToPage() et l'attribut window.location.href fourni par JavaScript est utilisé dans la fonction pour accéder à la page.

Par exemple, dans le code suivant, la fonction de saut jumpToPage() est définie, et la fonction est appelée dans l'événement click pour accéder à la page :

function jumpToPage(targetPage) {
  //TODO: 跳转到指定页码
  window.location.href = "http://www.example.com/page/" + targetPage;
}

$(".page").on("click", function () {
  var target = $(this).text();
  jumpToPage(target);
});

4 . Exemple complet#🎜 🎜#

Combiné avec les étapes ci-dessus, nous pouvons donner un exemple jQuery complet pour accéder au numéro de page, comme indiqué ci-dessous :

//获取当前页码
var currentPage = $(".current").text();

//定义跳转函数
function jumpToPage(targetPage) {
  window.location.href = "http://www.example.com/page/" + targetPage;
}

//为页码数字绑定点击事件
$(".page").on("click", function () {
  var target = $(this).text();
  jumpToPage(target);
});

Summary

# 🎜🎜#Grâce aux étapes ci-dessus, nous pouvons implémenter une fonction de saut de page simple et pratique. Cependant, il convient de noter que cet article n’est qu’un exemple simple et qu’une logique et une gestion des erreurs plus complexes peuvent être nécessaires dans le développement réel. Dans le même temps, si vous utilisez un plug-in de pagination basé sur jQuery, il peut exister une méthode plus pratique et personnalisable pour implémenter la fonction de saut de page.

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!