Javascript为php输出制作下一页和上一页

时间:2018-11-02 08:42:22

标签: javascript php html

我想为我正在使用的php输出制作上一页/下一页。但是,我通过2 LIMIT创建了输出,因为我只希望按page / divstyle进行两个选择(我将其设置为99999),并且不能使其下一个/上一个按钮起作用。您知道我是否需要JavaScript代码还是需要做其他事情,如果需要,怎么办?我不想转到另一个页面,我只想用这两个选择更改当前的divstyle并显示下两个。为此,我将LIMIT设置为9999999,但首先我需要弄清楚如何设置两个选择。

$sql10 = "SELECT username, Headshots, Murders, BanditsKilled, TotalBanditsKilled, ZombiesKilled, TotalZombiesKilled, TotalMurders, Backpack, pAdminLevel, pVIP, pHour, pMin, pSec, pBlood, pThrist, pHunger, Humanity, pJailed, pAliveTime, pPoints
            FROM users 
            where IP = '".$row['IP']."'
            order by pHour DESC LIMIT 2;";
            $results10 =  array();
            $result10 = mysqli_query($con,$sql10);

            $results10 = mysqli_fetch_all($result10, MYSQLI_ASSOC);
            $resulta10 = mysqli_fetch_array($result10);

        $output10 = '';

            foreach ($results10 as $row) {

$output10 .= '<div class="panel panel-profile list-view">
      <div class="panel-heading">
        <div class="media">
          <div class="media-left">
            <a href="#">
              <img class="media-object img-circle" src="../images/photos/user1.png" alt="">
            </a>
          </div>
          <div class="media-body">
            <h4 class="media-heading">'. $row['username'] . '</h4>';
if($pAdminLevel1 > 1) : 
    $output10 .= '<p class="media-usermeta"><i class="glyphicon glyphicon-briefcase"></i>' . $pAdminLevel . '</p>' ;
endif; 
if($Tester == 1) : 
    $output10 .= '<p class="media-usermeta"><i class="glyphicon glyphicon-briefcase"></i>Tester</p>' ;
endif; 

if($Tester == 0 && $pAdminLevel1 < 0) : 
    $output10 .= '<p class="media-usermeta"><i class="glyphicon glyphicon-briefcase"></i>Utilizator</p>' ;
endif; 

$output10 .= '</div>
        </div><!-- media -->
                <ul class="panel-options">
                  <li><a class="tooltips" href="" data-toggle="tooltip" title="" data-original-title="View Options"><i class="glyphicon glyphicon-option-vertical"></i></a></li>
                </ul>
              </div><!-- panel-heading -->

              <div class="panel-body people-info">
                <div class="row">
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Headshots</label>
                     ' . $row['Headshots'] . '
                    </div>
                  </div>
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Ucideri</label>
                     ' . $row['Murders'] . '
                    </div>
                  </div>
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Bandiți uciși</label>
                     ' . $row['BanditsKilled'] . '
                    </div>
                  </div>
                </div><!-- row -->
                <div class="row">
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Numărul total de bandiți uciși:</label>
                      <h4>'. $row['TotalBanditsKilled'] . '</h4>
                    </div>
                  </div>
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Zombie uciși</label>
                      <h4>'. $row['ZombiesKilled'] . '</h4>
                    </div>
                  </div>
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Numărul total de zombie uciși:</label>
                        <h4>'. $row['TotalZombiesKilled'] . '</h4>
                    </div>
                  </div>
                </div><!-- row -->
                <div class="row">
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Ucideri Totale:</label>
                     ' . $row['TotalMurders'] . '
                    </div>
                  </div>
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Rucsac</label>
                     ' .$Backpack . '
                    </div>
                  </div>
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>VIP</label>
                     ' . $pVIP . '
                    </div>
                  </div>
                </div><!-- row -->
                <div class="row">
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Level:</label>
                      <h4>'. $row['pHour'] . '</h4>
                    </div>
                  </div>
                  <div class="col-sm-4">
                    <div class="info-group">
                      <label>Ore jucate în total:</label>
                      <h4>'. $row['pHour'] . ':'. $row['pMin'] . '</h4>
                    </div>
                  </div>
                  <div class="col-sm-4">
                        <div class="info-group">
                          <label>Sânge</label>
                            <h4>'. $row['pBlood'] . ' litri</h4>
                        </div>
                      </div>
                  </div>
                    <div class="row">
                      <div class="col-sm-4">
                        <div class="info-group">
                          <label>Sete</label>
                         ' . $row['pThrist'] . '
                        </div>
                      </div>
                      <div class="col-sm-4">
                        <div class="info-group">
                          <label>Foamete</label>
                         ' . $row['pHunger'] . '
                        </div>
                      </div>
                      <div class="col-sm-4">
                        <div class="info-group">
                          <label>Umanitate</label>
                         ' . $row['Humanity'] . '
                        </div>
                      </div>
                    </div><!-- row -->
                    <div class="row">
                      <div class="col-sm-4">
                        <div class="info-group">
                          <label>Admin Jail:</label>
                          <h4>'. $row['pJailed'] . '</h4>
                        </div>
                      </div>
                      <div class="col-sm-4">
                        <div class="info-group">
                          <label>Timp în viață:</label>
                          <h4>'. $row['pAliveTime'] . '</h4>
                        </div>
                      </div>
                      <div class="col-sm-4">
                        <div class="info-group">
                          <label>Credite:</label>
                            <h4>'. $row['pPoints'] . '</h4>
                        </div>
                      </div>
                      </div>
                    </div><!-- row -->
            </div><!-- panel -->';

和HTML部分。

       <div class="col-sm-8 col-md-9 col-lg-10 people-list">
            <div class="people-options clearfix">



              <div class="btn-group pull-right people-pager">
                <button type="button" onclick="previous()" class="btn btn-default"><i class="fa fa-chevron-left"></i></button>
                <button type="button" onclick="next()" class="btn btn-default"><i class="fa fa-chevron-right"></i></button>
              </div>
              <span class="people-count pull-right">Selected<strong>1-2</strong> of your accounts</span>
            </div><!-- people-options -->

<?php echo $output10 ?>


          </div>

2 个答案:

答案 0 :(得分:0)

使用数据表代替javascript分页。它始终是最好的免费开放源代码。

https://datatables.net/

答案 1 :(得分:0)

相反,您可以使用Turbolinks js(这是一种库,可以使页面加载更快且异步),您可以通过以下链接从github克隆它: Turbolinks使浏览Web应用程序更快

https://github.com/turbolinks/turbolinks