在页面导航时更改SQL语句

时间:2018-03-15 04:31:33

标签: javascript php html sql

我对所有这些都很新,所以如果不可能的话,请纠正我。

我正在尝试使用此SQL语句显示数据:

SELECT * FROM trail101 WHERE activities IN(\'Murals\',\'Concert\',\'Theater\',\'Museums\') ORDER BY id DESC LIMIT 0, 9

它只显示我拥有的前9个数据,但我希望能够导航到下一个9,其中单击分页会将SQL语句更新为ORDER BY id DESC LIMIT 9, 18以用于下一个页面等等。我该如何编写脚本呢?我有以下导航代码:

<div class="w3-center w3-padding-32">
<div class="w3-bar">
  <a href="#" class="w3-bar-item w3-button w3-hover-black" class="w3-bar-item w3-button w3-hover-black">«</a>
  <a href="#" class="w3-bar-item w3-black w3-button">1</a>
  <a href="#" class="w3-bar-item w3-button w3-hover-black">2</a>
  <a href="#" class="w3-bar-item w3-button w3-hover-black">3</a>
  <a href="#" class="w3-bar-item w3-button w3-hover-black">4</a>
  <a href="#" class="w3-bar-item w3-button w3-hover-black">»</a>
</div>

1 个答案:

答案 0 :(得分:1)

使用您的分页查询获得一个简单的代码示例,请查看

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Compiled and minified CSS -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-alpha.4/css/materialize.min.css">

    <!-- Compiled and minified JavaScript -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-alpha.4/js/materialize.min.js"></script>
    
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

<div class="main">
<div class="card">
      <div class="card-content">
      <span class="card-title activator grey-text text-darken-4">Card Title<i class="material-icons right">more_vert</i></span>
      <p><a href="#">This is a link</a></p>
    </div>
    <div class="card-image waves-effect waves-block waves-light">
      <img class="activator-custom" src="http://materializecss.com/images/office.jpg">
    </div>

    <div class="card-reveal">
      <span class="card-title-custom grey-text text-darken-4">Card Title<i class="material-icons right">close</i></span>
      <p>Here is some more information about this product that is only revealed once clicked on.</p>
    </div>
  </div>
</div>