Maison développement back-end tutoriel php PHP et Ajax implémentent le partage de code pour la fonction de pagination sans actualisation

PHP et Ajax implémentent le partage de code pour la fonction de pagination sans actualisation

Feb 10, 2018 am 10:44 AM
ajax php 功能

Cet article présente principalement la fonction de pagination sans rafraîchissement implémentée par PHP+Ajax et analyse les techniques d'implémentation associées de PHP+ajax via la classe d'opération pdo pour lire la base de données et l'afficher en pagination sur la base d'exemples spécifiques. est livré avec un code source de démonstration que les lecteurs peuvent télécharger. Pour référence, les amis qui en ont besoin peuvent s'y référer. J'espère que cela pourra aider tout le monde.

Remarque : Certaines des bibliothèques de classes utilisées dans cet article peuvent retrouver leurs codes sources dans les articles précédents. J'indiquerai les liens dans l'article afin de raccourcir la longueur de l'article. , la lecture qui en résulte Nous nous excusons pour la gêne occasionnée.

Cet article explique l'implémentation Ajax de la pagination sans actualisation, les principes d'implémentation, l'affichage du code et le téléchargement du code.

Certaines connaissances doivent être expliquées ici :

1. Les avantages d'Ajax sans rafraîchir la page : Offrir une bonne expérience client, obtenir les données de la base de données en arrière-plan via Ajax et les afficher. , et éliminez le besoin d'attendre que la page se charge Et l'état vide qui apparaît

2 Alors, la page Ajax non actualisée s'exécute-t-elle sur une page dynamique (.php) ? Ou une page statique (.html/.htm/.shtml) ? La réponse est : page statique ;

3. Principe de mise en œuvre : Les données renvoyées par la page dynamique sont obtenues et affichées grâce à la combinaison du programme de script JS frontal et d'Ajax.

D'accord, expliquons le code ci-dessous :

Puisqu'il s'exécute sur une page statique, nous créons d'abord une page HTML statique. La liste de codes de index.html est la suivante.

index.html


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="js/ajax.js"></script> <!-- 载入 Ajax 类库 -->
<title>Ajax 实现无刷新页面</title>
<style type="text/css">
 body {
  font-size:12px;
 }
</style>
</head>
<body>
 <p id="fpage">数据加载中...</p>
</body>
</html>
Copier après la connexion

Dans la liste des codes, nous avons chargé une bibliothèque de classes Ajax, qui peut être trouvée sur http://www . Trouvé dans l'article jb51.net/article/82066.htm (avec instructions d'utilisation)

Dans cette page statique, seul un "Chargement des données..." sera affiché, et il n'y aura aucune donnée. À l'heure actuelle, nous avons besoin d'un script JS pour obtenir les données de la base de données via Ajax. Le script JS est le suivant :


<script type="text/javascript">
 /**
 * setPage(url) 根据 url 从 article.php 中获取数据
 * @param int pageNum 页码
 * @return string
 */
 var cache=new Array(); // 缓存变量,当数据被访问过之后放置在缓存中,加快访问速度
 function setPage(pageNum) {
  var fpage = document.getElementById(&#39;fpage&#39;); // 获取 fpage 对象
  // 如果缓存中存在数据,那么直接从缓存中读取;如果不存在数据,那么就从数据库中读取,并把数据存入缓存
  if (typeof(cache[pageNum])==&#39;undefined&#39;) {
   var ajax = Ajax();
   ajax.get(&#39;article.php?page=&#39;+pageNum, function(data){
    fpage.innerHTML = data; // fpage对象的内容是从 article.php 中取来的
    cache[pageNum] = data;
   })
  } else {
   fpage.innerHTML = cache[pageNum];
  }
 }
 setPage(1); // 默认执行
</script>
Copier après la connexion

Lisez attentivement le code ci-dessus, vous retrouverez le phénomène suivant :

1 setPage(pageNum) est un esclave de l'interface de fonction JS de la base de données pour extraire les données ;
2. Ajax obtient les données via le fichier article.php
3, où xx est les données du numéro de page ; obtenu,
setPage(1) : Obtenez les données sur la page 1 ;
setPage(2) : Obtenez les données sur la page 2 ;
setPage(100) : Obtenez les données sur la page 100 ; ……
Alors, comment récupérer les données du fichier article.php ? Veuillez consulter la liste des codes ci-dessous.

article.php


<?php
/**
* $Id: article.php
* author Lee.
* Last modify $Date: 2012-01-21 16:53:05 $
*/
require_once &#39;./config.inc.php&#39;;
$m = new Model();
$page = new ajaxPage($m->total(&#39;article&#39;),20); // $m->total(&#39;article&#39;) 获取 article 表的记录数;10为每页显示十条
$result = $m->fetchAll(&#39;article&#39;, &#39;*&#39;, &#39;&#39;, &#39;&#39;, $page->limit); // 取出数据,^_^,很方便吧
echo &#39;<table align="center" border="1" width="1100" style="border-collapse:collapse;font-size:14px;" bordercolor="#666">&#39;;
echo &#39;<caption><h1>华强电子网资讯</h1></caption>&#39;;
echo &#39;<tr height="25"><th>ID</th><th>Title</th><th>Author</th><th>Source</th><th>Date</th></tr>&#39;;
foreach ($result as $v) {
 echo "<tr height=&#39;21&#39;><td align=&#39;center&#39;>{$v[&#39;id&#39;]}</td><td>{$v[&#39;title&#39;]}</td><td align=&#39;center&#39;>{$v[&#39;author&#39;]}</td><td align=&#39;center&#39;>{$v[&#39;source&#39;]}</td><td align=&#39;center&#39;>{$v[&#39;date&#39;]}</td></tr>";
}
echo &#39;<tr><td align="right" colspan="5">&#39;.$page->fpage().&#39;</td></tr>&#39;;
echo &#39;</table>&#39;;
?>
Copier après la connexion
Les données connectées dans article.php sont les données d'information capturées par Huaqiang Electronics Network dans l'article précédent, car le les données sont relativement volumineuses, le fichier article.sql sera joint au téléchargement du package de code pour que tout le monde puisse le tester.

Les données affichées sur la page statique index.html sont le code d'écho dans le fichier article.php.

Le fichier config.inc.php dans le fichier de code définit principalement certaines constantes, telles que : le nom d'utilisateur de la base de données, le mot de passe de la base de données, l'hôte..., la bibliothèque de classes de connexion à la base de données (Db.class.php) et la base de données Bibliothèque de classes d'opérations (Model.class.php), veuillez vous référer à l'article http://www.jb51.net/article/82063.htm, avec les instructions d'utilisation.

Rendu du programme :

La figure suivante marque les endroits auxquels il faut prêter attention.

De cette façon, la pagination sans rafraîchissement Ajax est terminée. Il y a aussi un ajaxPage.class.php dans le programme qui n'est pas expliqué. En fait, l'utilisation de cette bibliothèque de classes ajaxPage est la même que celle de la bibliothèque de classes de pagination générale.

C'est-à-dire :


$page = new ajaxPage(记录总数, 每页显示数);
Copier après la connexion

Implémentation simple d'Ajax sans effet de pagination de rafraîchissement

php ajax Pas de pagination d'actualisation, prise en charge de l'exemple de code de positionnement de l'identifiant

JQuery+Ajax pas d'exemple de code de pagination d'actualisation

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

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Comment déverrouiller tout dans Myrise
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

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)

Guide d'installation et de mise à niveau de PHP 8.4 pour Ubuntu et Debian Guide d'installation et de mise à niveau de PHP 8.4 pour Ubuntu et Debian Dec 24, 2024 pm 04:42 PM

PHP 8.4 apporte plusieurs nouvelles fonctionnalités, améliorations de sécurité et de performances avec une bonne quantité de dépréciations et de suppressions de fonctionnalités. Ce guide explique comment installer PHP 8.4 ou mettre à niveau vers PHP 8.4 sur Ubuntu, Debian ou leurs dérivés. Bien qu'il soit possible de compiler PHP à partir des sources, son installation à partir d'un référentiel APT comme expliqué ci-dessous est souvent plus rapide et plus sécurisée car ces référentiels fourniront les dernières corrections de bogues et mises à jour de sécurité à l'avenir.

Date et heure de CakePHP Date et heure de CakePHP Sep 10, 2024 pm 05:27 PM

Pour travailler avec la date et l'heure dans cakephp4, nous allons utiliser la classe FrozenTime disponible.

Discuter de CakePHP Discuter de CakePHP Sep 10, 2024 pm 05:28 PM

CakePHP est un framework open source pour PHP. Il vise à faciliter grandement le développement, le déploiement et la maintenance d'applications. CakePHP est basé sur une architecture de type MVC à la fois puissante et facile à appréhender. Modèles, vues et contrôleurs gu

Téléchargement de fichiers CakePHP Téléchargement de fichiers CakePHP Sep 10, 2024 pm 05:27 PM

Pour travailler sur le téléchargement de fichiers, nous allons utiliser l'assistant de formulaire. Voici un exemple de téléchargement de fichiers.

CakePHP créant des validateurs CakePHP créant des validateurs Sep 10, 2024 pm 05:26 PM

Le validateur peut être créé en ajoutant les deux lignes suivantes dans le contrôleur.

Comment configurer Visual Studio Code (VS Code) pour le développement PHP Comment configurer Visual Studio Code (VS Code) pour le développement PHP Dec 20, 2024 am 11:31 AM

Visual Studio Code, également connu sous le nom de VS Code, est un éditeur de code source gratuit – ou environnement de développement intégré (IDE) – disponible pour tous les principaux systèmes d'exploitation. Avec une large collection d'extensions pour de nombreux langages de programmation, VS Code peut être c

Guide rapide CakePHP Guide rapide CakePHP Sep 10, 2024 pm 05:27 PM

CakePHP est un framework MVC open source. Cela facilite grandement le développement, le déploiement et la maintenance des applications. CakePHP dispose d'un certain nombre de bibliothèques pour réduire la surcharge des tâches les plus courantes.

Comment analysez-vous et traitez-vous HTML / XML dans PHP? Comment analysez-vous et traitez-vous HTML / XML dans PHP? Feb 07, 2025 am 11:57 AM

Ce tutoriel montre comment traiter efficacement les documents XML à l'aide de PHP. XML (Language de balisage extensible) est un langage de balisage basé sur le texte polyvalent conçu à la fois pour la lisibilité humaine et l'analyse de la machine. Il est couramment utilisé pour le stockage de données et

See all articles