コミュニティ
学ぶ
ツールライブラリ
AIツール
レジャー
検索
日本語
ホームページ > バックエンド開発 > PHPチュートリアル > php +ajax +sql ページングを実装する

php +ajax +sql ページングを実装する

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
リリース： 2016-06-23 13:36:22
オリジナル
971 人が閲覧しました

前の章: データ対話を実現するための php +ajax +sql

前の章では、データの非同期ロードを実装するための php +ajax +sql について説明しました。ここでは、ajax を使用してページングを実現します。

注: ここでのコードの大部分は前の章と似ています


1 まず、テーブルの内容は上に示すように、別の場所を使用します。 :


2. データベースにリンクする新しいパブリック ファイル conn.php を作成します: 

<strong><?php</strong> header(<strong>"Content-Type:text/html;charset=utf8"</strong>);//申明编码格式 $conn=mysql_connect(<strong>"localhost"</strong>,<strong>"root"</strong>,<strong>"aaaaaa"</strong>) <strong>or die</strong>(<strong>"</strong><strong>数据库连接错误</strong><strong>"</strong>.mysql_errno());//连接sql mysql_select_db(<strong>"phptest"</strong>,$conn);mysql_query(<strong>'SET NAMES UTF8'</strong>) <strong>or die</strong>(<strong>'</strong><strong>字符集设置错误</strong><strong>'</strong>.mysql_error());//设置输入的字符集编码 <strong>?></strong>
ログイン後にコピー
<strong>3.php服务端提供给前端ajax数据接口，新建文件phptoAJAX。php</strong>
ログイン後にコピー
<strong></strong><pre class='brush:php;toolbar:false;'><strong><?php</strong> <strong>require_once</strong>(<strong>"conn.php"</strong>);//导入公用文件
ログイン後にコピー
<pre class="n">$page=<strong>isset</strong>($_POST[<strong>"index"</strong>])?$_POST[<strong>"index"</strong>]:1;//限制行数，$_POST[<strong>"index"]为前端ajax提交的数据</strong>
ログイン後にコピー
$query=mysql_query(<strong>"SElECT * FROM txt LIMIT </strong>$page<strong>,5"</strong>) <strong>or die</strong>(<strong>"</strong><strong>错误提示：</strong><strong>"</strong>.mysql_error());//动态修改获取行数的基数$page
ログイン後にコピー
$jsonArray=

array();//新しいデータは、に対応するデータ グループを受け取るために使用されます。データベースの各行while($rows= mysql_fetch_array($query)){
 //处理数据库里面的自动对应的内容  $rows[<strong>'content'</strong>]=mb_substr(strip_tags(htmlspecialchars_decode($rows[<strong>'content'</strong>])),0,100,<strong>"utf-8"</strong>);  //把数据库的内容添加到新建数组中
ログイン後にコピー
 array_push($jsonArray,$rows);//注意这里是$rows  } <strong>echo </strong>json_encode($jsonArray);//转换成json传递给前端
ログイン後にコピー
4.新建phpToAJAX.HTML前端接收数据，这里我用jquery封装好的ajax方法，执行后的页面如下图所示：
ログイン後にコピー
<pre class="n"><!DOCTYPE <strong>html</strong>><<strong>html</strong>><<strong>head </strong><strong>lang=</strong><strong>"en"</strong>>    <<strong>meta </strong><strong>charset=</strong><strong>"UTF-8"</strong>>    <<strong>title</strong>></<strong>title</strong>>
ログイン後にコピー
<pre class="n"><<strong>style</strong>> //给分页节点添加点样式    <strong>*</strong>{<strong>margin</strong>:0;}    <strong>ul</strong>{<strong>height</strong>:400<strong>px</strong>;<strong>width</strong>:800<strong>px</strong>;<strong>margin</strong>:0 <strong>auto</strong>;}    .<strong>page</strong>{<strong>width</strong>:800<strong>px</strong>;<strong>height</strong>:30<strong>px</strong>;<strong>margin</strong>:0 <strong>auto</strong>;}    <strong>li</strong>{<strong>font-size</strong>: 14<strong>px</strong>;}    <strong>span</strong>{<strong>padding</strong>:0 2<strong>px</strong>;<strong>cursor</strong>:<strong>pointer</strong>;}    .<strong>inline</strong>{<strong>background</strong>:<strong>#009999</strong>;<strong>color</strong>:<strong>#fff</strong>;}    .<strong>inline</strong>:<strong>hover</strong>{<strong>color</strong>:<strong>#006600</strong>;<strong>text-decoration</strong>: <strong>underline</strong>;}</<strong>style</strong>>
ログイン後にコピー
<script type="text/javascript" src="jquery-1.8.3.min .js">スクリプト>頭><body>
<pre class="n"><strong><?php //生成分页 include("conn.php"); $pagesize=1; session_start(); $p=$_POST["index"]?$_POST["index"]:1; $_SESSION["p"]=$p; $pat=$_SESSION["p"]; $query=mysql_query("SELECT count(*) FROM txt") or die("数据链接错误：".mysql_error());//获取表的所有行，用来显示行的总是 $count_array = mysql_fetch_array($query); </strong><strong></strong><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>//获取表的函数
ログイン後にコピー
ログイン後にコピー
$pagenum=ceil($count_array['count(*)']/10 );
//获取表的函数
ログイン後にコピー
for($i =1;$i<=$pagenum;$i++)
//生成制作分页的DOM
ログイン後にコピー
{ echo ' '.$i.'
< ul id="list">
  <!--数据将在这里显示-->
ログイン後にコピー
ul><script type="text/javascript"> ;
    $(<strong>function</strong>(){
ログイン後にコピー
e
   $.ajax({
ログイン後にコピー
        <strong>type</strong>: <strong>"post"</strong>,//传递方法
ログイン後にコピー
        <strong>url</strong>: <strong>"phpToAJAX.php"</strong>,//数据接口
ログイン後にコピー
        <strong>dataType</strong>: <strong>"json"</strong>,//接收格式
ログイン後にコピー
        success: <strong>function</strong>(msg)//如果接收成功执行以下
ログイン後にコピー
        {
ログイン後にコピー
          <strong>var </strong>li=<strong>""</strong>;
ログイン後にコピー
          <strong>for</strong>(<strong>var </strong>i =0;i<msg.<strong>length</strong>-1;i++)//这里是限定10个
ログイン後にコピー
 {
ログイン後にコピー
script>body>html>rreee
                  li+=<strong>"<li><h2>"</strong>+msg[i][<strong>'title'</strong>]+<strong>"</h2><p>"</strong>+msg[i][<strong>'content'</strong>]+<strong>"...<a href='phpArtcle.php?art="</strong>+msg[i][<strong>'id'</strong>]+<strong>"' target='_blank'></strong><strong>详细</strong><strong></a></p></li>"</strong>;                    }                $(<strong>"#list"</strong>).html(li);
ログイン後にコピー
        },
ログイン後にコピー
          error:<strong>function</strong>()//如果接收不成功执行以下
ログイン後にコピー
          {                    console.log(<strong>"</strong><strong>链接错误</strong><strong>"</strong>)          }        });    });
ログイン後にコピー
if ($rows=mysql_fetch_array($query)){ エコー "< h1>".$rows['タイトル' -------------------終了---------------- -------
関連ラベル：
php +ajax +sql 实现分页
前の記事：SQLクエリを配列に乗算した後、配列内の値を変数に格納するにはどうすればよいですか? 次の記事：初心者。戻り値を取得するには、file_get_contents() を直接呼び出してください。ただし、ajax 経由で file_get_contents を含むバックグラウンドを呼び出すと、応答がありません。
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
リモート ウェアハウスを git に追加した後、プッシュできません
から 1970-01-01 08:00:00
0
0
0
Objective-C のブロックと Swift のクロージャの違いは何ですか?
から 1970-01-01 08:00:00
0
0
0
github - git は特定のサフィックスを除くすべてのファイルを無視できますか
から 1970-01-01 08:00:00
0
0
0
object-c - この cas ファイルを偶然見ましたか?これはどのように書かれているか聞いてもいいでしょうか？
から 1970-01-01 08:00:00
0
0
0
bash での git 完了エラー
から 1970-01-01 08:00:00
0
0
0
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート