In diesem Artikel wird hauptsächlich die von PHP + Ajax implementierte Nicht-Aktualisierungs-Paging-Funktion vorgestellt und anhand spezifischer Beispiele die zugehörigen Implementierungstechniken von PHP + Ajax zum Lesen der Datenbank und Anzeigen im Paging analysiert Im Lieferumfang ist ein Demo-Quellcode enthalten, den die Leser als Referenz herunterladen können. Ich hoffe, dass er allen helfen kann.
Hinweis: Einige der in diesem Artikel verwendeten Klassenbibliotheken finden sich in früheren Artikeln, um die Länge des Artikels zu verkürzen , die resultierende Lesung Wir entschuldigen uns für die Unannehmlichkeiten.
In diesem Artikel werden die Ajax-Implementierung von aktualisierungsfreiem Paging, Implementierungsprinzipien, Codeanzeige und Code-Download erläutert.
Einige Kenntnisse müssen hier erklärt werden:
1. Die Vorteile von Ajax ohne Aktualisierung der Seite: Bieten Sie ein gutes Kundenerlebnis, beziehen Sie Daten aus der Datenbank im Hintergrund über Ajax und zeigen Sie sie an und das Warten auf das Laden der Seite entfällt.
2 Läuft die Ajax-Seite ohne Aktualisierung auf einer dynamischen Seite (.php)? Oder eine statische Seite (.html/.htm/.shtml)? Die Antwort lautet: statische Seite;
3. Implementierungsprinzip: Die von der dynamischen Seite zurückgegebenen Daten werden durch die Kombination von Front-End-JS-Skriptprogramm und Ajax abgerufen und angezeigt.
Okay, lassen Sie uns den folgenden Code erklären:
Da er auf einer statischen Seite ausgeführt wird, erstellen wir zunächst eine statische HTML-Seite. Die Codeliste von index.html lautet wie folgt.
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>Im Codelisting haben wir eine Ajax-Klassenbibliothek geladen, die unter http://www.index.html zu finden ist . Gefunden im Artikel jb51.net/article/82066.htm (mit Gebrauchsanweisungen)
Auf dieser statischen Seite wird nur „Daten werden geladen…“ angezeigt und es werden keine Daten angezeigt. Zu diesem Zeitpunkt benötigen wir ein JS-Skript, um Daten aus der Datenbank über Ajax abzurufen. Das JS-Skript lautet wie folgt:
<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('fpage'); // 获取 fpage 对象
// 如果缓存中存在数据，那么直接从缓存中读取；如果不存在数据，那么就从数据库中读取，并把数据存入缓存
if (typeof(cache[pageNum])=='undefined') {
var ajax = Ajax();
ajax.get('article.php?page='+pageNum, function(data){
fpage.innerHTML = data; // fpage对象的内容是从 article.php 中取来的
cache[pageNum] = data;
})
} else {
fpage.innerHTML = cache[pageNum];
}
}
setPage(1); // 默认执行
</script>Lesen Sie den obigen Code sorgfältig. Sie werden das folgende Phänomen feststellen:
1. ist ein Slave aus der Datenbank-JS-Funktionsschnittstelle zum Extrahieren von Daten;
2. Ajax erhält Daten über die Datei „article.php?page=xx“. erhalten,
setPage(1): Holen Sie sich die Daten auf Seite 1;
setPage(2): Holen Sie sich die Daten auf Seite 2;
……
Wie erhält man also Daten aus der Datei „article.php“? Bitte beachten Sie die Codeliste unten.
article.php
<?php
/**
* $Id: article.php
* author Lee.
* Last modify $Date: 2012-01-21 16:53:05 $
*/
require_once './config.inc.php';
$m = new Model();
$page = new ajaxPage($m->total('article'),20); // $m->total('article') 获取 article 表的记录数；10为每页显示十条
$result = $m->fetchAll('article', '*', '', '', $page->limit); // 取出数据，^_^，很方便吧
echo '<table align="center" border="1" width="1100" style="border-collapse:collapse;font-size:14px;" bordercolor="#666">';
echo '<caption><h1>华强电子网资讯</h1></caption>';
echo '<tr height="25"><th>ID</th><th>Title</th><th>Author</th><th>Source</th><th>Date</th></tr>';
foreach ($result as $v) {
echo "<tr height='21'><td align='center'>{$v['id']}</td><td>{$v['title']}</td><td align='center'>{$v['author']}</td><td align='center'>{$v['source']}</td><td align='center'>{$v['date']}</td></tr>";
}
echo '<tr><td align="right" colspan="5">'.$page->fpage().'</td></tr>';
echo '</table>';
?>Die auf der statischen Seite index.html angezeigten Daten sind der Echocode in der Datei „article.php“.
Die Datei config.inc.php in der Codedatei definiert hauptsächlich einige Konstanten, wie zum Beispiel: Datenbankbenutzername, Datenbankkennwort, Host ..., Datenbankverbindungsklassenbibliothek (Db.class.php) und Datenbank Informationen zur Operationsklassenbibliothek (Model.class.php) finden Sie im Artikel http://www.jb51.net/article/82063.htm mit Anweisungen zur Verwendung.
Programm-Rendering:
Die folgende Abbildung markiert die Stellen, auf die man achten sollte.
Auf diese Weise wird das Ajax-Non-Refresh-Paging abgeschlossen. Es gibt auch eine ajaxPage.class.php im Programm, die nicht erklärt wird. Tatsächlich ist die Verwendung dieser ajaxPage-Klassenbibliothek dieselbe wie die der allgemeinen Paging-Klassenbibliothek.
Das heißt:
$page = new ajaxPage(记录总数, 每页显示数);
Das obige ist der detaillierte Inhalt vonPHP und Ajax implementieren Code-Sharing für die Paging-Funktion ohne Aktualisierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Ajax-Tutorial
Ajax-Lösung für verstümmelten chinesischen Code
So öffnen Sie eine PHP-Datei
So entfernen Sie die ersten paar Elemente eines Arrays in PHP
Was tun, wenn die PHP-Deserialisierung fehlschlägt?
So verbinden Sie PHP mit der MSSQL-Datenbank
So verbinden Sie PHP mit der MSSQL-Datenbank
So laden Sie HTML hoch
