如何在没有数据库的情况下创建 AJAX 分页?
Posted
技术标签:
【中文标题】如何在没有数据库的情况下创建 AJAX 分页?【英文标题】:How to create AJAX pagination without a database? 【发布时间】:2015-09-24 17:39:52 【问题描述】:是否可以在没有 mysql 帮助的情况下为 AJAX 分页获取页面?我不能只添加一个带有我需要显示的文本和标记的 php 文件,然后通过单击页码将该内容提供给用户吗?那么这可以用纯jQuery和PHP来实现吗?你会用什么代码方法来保持简单,我的意思是我需要将 3 面文本墙添加到我的网站,但在页面上一次添加它们会使用户感到困惑。所以我决定根据用户的决定想办法一次只保留其中一个。一个代码示例会很棒!
编辑: PHP 代码应该是这样的吗?
<?php
htmlspecialchars($_GET["page_number"]);
if ($page_number == 1)
$text = var_export($text1, true);
if ($page_numer == 2)
$text = var_export($text2, true);
if ($page_number == 3)
$text = var_export($text3, true);
$text1 = 'some looong text...';
$text2 = 'another wall of text';
$text3 = 'and yet another one';
?>
【问题讨论】:
您可以查看此链接:***.com/questions/21347844/… 【参考方案1】:是的,你可以。您必须在此处遵循分页规则。您需要在 url 中传递页码和记录限制。
www.example.com/index.php?page=1&limit=10
现在您创建一个文本或 php 文件并使用 var_export 导出其中的所有数据以返回数组或其他您喜欢的方式。
现在你必须得到页码,诀窍就在这里。
你从文本文件中得到的数组应该被限制分割。
$rows = array_chunk($array,$_GET['limit'])
;
page = $n 的结果在这里。
$result = $row[$_GET['page']]
这是我的 index.php 文件。
<?php
$array = include_once('data.php');
$page = $_GET['page'] ? $_GET['page'] : 0;
$limit = $_GET['limit'];
$rows = array_chunk($array,$limit);
$result = $rows[$page];
?>
<table>
<tr>
<th>Id</th>
<th>Name</th>
<th>Desc</th>
<th>Status</th>
</tr>
<?php
foreach ($result as $res)
?>
<tr>
<td><?php echo $res['id'] ?></td>
<td><?php echo $res['name'] ?></td>
<td><?php echo $res['desc'] ?></td>
<td><?php echo $res['status'] ?></td>
</tr>
<?php
?>
<tr>
<td colspan="2">
<?php
if($page>0)
?>
<a href="index.php?limit=<?php echo $limit; ?>&page=<?php echo ($page-1); ?>">Previous</a>
<?php
?>
</td>
<td colspan="2">
<?php
if (isset($rows[$page+1]))
?>
<a href="index.php?limit=<?php echo $limit; ?>&page=<?php echo ($page+1); ?>">Next</a>
<?php
?>
</td>
</tr>
</table>
这里是 data.php 文件。我已经使用数组来返回值。
<?php
return
$array = [
[
'id' => 1,
'name' => 'A',
'desc' => 'Test',
'status' => 'Active'
],
[
'id' => 2,
'name' => 'B',
'desc' => 'Test',
'status' => 'Active'
],
[
'id' => 3,
'name' => 'C',
'desc' => 'Test',
'status' => 'Active'
],
[
'id' => 4,
'name' => 'D',
'desc' => 'Test',
'status' => 'Active'
],
[
'id' => 5,
'name' => 'E',
'desc' => 'Test',
'status' => 'Active'
],
[
'id' => 6,
'name' => 'F',
'desc' => 'Test',
'status' => 'Active'
],
];
【讨论】:
我已经编辑了我的问题。应该是这样的吧? 给我几分钟。我给你举了一个完美的例子。 是的,这行得通,谢谢!所以现在我应该可以用我需要输出的文本替换那些数组索引了。 是的。并且还可以根据您的要求进行 ajax 调用。【参考方案2】:可能是这样的?
HTML+JS:
<body>
<div id="text">
</div>
<ul id="pager">
<li><a href="#0" class="active">1</a></li>
<li><a href="#1">2</a></li>
<li><a href="#2">3</a></li>
</ul>
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ()
var pager = jQuery('#pager'),/* get pager list*/
currentInd = pager.find('.active').attr('href').replace('#', ''), /* get active element*/
text = jQuery('#text'); /* Text wrapper */
/* Get first text by Ajax*/
jQuery.ajax(
method: 'POST',
url: '/index.php',
data:
page: currentInd
).done(function (data)
text.text(data);
);
);
/** On pager link click */
jQuery(document).on('click', '#pager a', function (e)
e.preventDefault();
var ind = jQuery(this).attr('href').replace('#', ''),/* take number */
text=jQuery('#text'); /* text wrapper */
/* if this link is not active then send ajax request */
if (!jQuery(this).hasClass('active'))
jQuery.ajax(
method: 'POST',
url: '/index.php',
data:
page: ind
).done(function (data)
jQuery('#pager').find('.active').removeClass('active');
jQuery(this).addClass('active');
text.text(data);
);
);
</script>
</body>
php:
<?php
$texts = array(
'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt aperiam quis eaque ullam reprehenderit eveniet incidunt error nisi a earum voluptatem consequuntur magnam atque. Quis ipsa quo tempora libero consequuntur cumque perferendis quos atque ipsam nisi maiores ad sit iusto sequi voluptates eos neque aut asperiores ut nihil est at enim. Doloribus similique quae blanditiis provident soluta temporibus dolores libero obcaecati rerum distinctio recusandae molestiae perspiciatis dolorum quam magnam ex atque quidem exercitationem totam non sapiente magni amet delectus sequi quos at enim laborum fuga excepturi! Blanditiis illo modi harum voluptates provident hic libero explicabo culpa repellat distinctio molestias tempora obcaecati fuga. Omnis illum aliquam id nihil neque veniam laborum accusamus quidem odit porro nostrum distinctio ipsa atque quisquam natus sit excepturi at eius pariatur voluptates aspernatur nemo ipsam iure iusto ea minus tempora quod voluptate a doloremque mollitia dolorem suscipit blanditiis. Expedita itaque quibusdam magnam quod perspiciatis suscipit? ?',
'Impedit laborum quis accusamus recusandae perferendis a optio neque tempora dolorem cum. Unde nihil nesciunt minima dicta ut sequi est hic voluptatem error totam rerum sit impedit magnam dolores earum quasi architecto dolorum accusamus ad nemo blanditiis fugiat eveniet eligendi quas ipsum aperiam vitae ducimus inventore quidem officia corporis consequatur minus excepturi. Facere a nihil tempore tempora adipisci aperiam itaque delectus sint libero quisquam rerum tenetur eaque repellat pariatur nobis commodi labore et dignissimos impedit similique saepe illo quae cum quasi repellendus iusto recusandae vel eos rem doloremque atque aliquid dolores ab vitae architecto esse quos? Veniam odio aliquam atque iusto vel laudantium tenetur inventore eius ad earum ex minima nulla nesciunt nam aspernatur nihil facilis doloribus neque rerum reiciendis at minus non veritatis cumque molestiae qui natus excepturi! Unde aliquid corrupti optio minus itaque deleniti architecto similique molestiae mollitia nobis. Saepe ullam commodi nisi doloremque tenetur officiis officia asperiores quaerat minima amet consequuntur est totam eligendi. Laudantium voluptate impedit reiciendis fugit?',
'Aut inventore consequuntur fugit adipisci optio amet corporis voluptate tenetur quo et. Sunt repellendus sit voluptate quas sequi cupiditate veniam dignissimos nisi rerum deleniti molestias error veritatis soluta? Similique voluptatibus aperiam vitae ipsa omnis modi unde rerum odio saepe possimus voluptas illum odit vel cupiditate nam totam labore id ratione mollitia accusantium quidem repellat beatae placeat animi dolorum aut minima quos dolor iure sapiente praesentium asperiores cum pariatur sit earum eos sint deserunt commodi nobis tenetur aliquam reiciendis assumenda harum a voluptatum consequuntur. '
);
if (isset($_POST['page']) && isset($texts[$_POST['page']]))
echo $texts[$_POST['page']];
else
echo $texts[0];
?>
注意:这是一个非常简单的例子
【讨论】:
以上是关于如何在没有数据库的情况下创建 AJAX 分页?的主要内容,如果未能解决你的问题,请参考以下文章
ajax查询后如何更新knppaginatorbundle的分页模板
如何使用ajax创建数组并在没有回调函数的情况下对其进行修改?
如何在没有选择的情况下使用 angularjs 将每个分页单独导出到 ag 网格数据的 Excel
如何在没有 AJAX 的情况下在 Rails 客户端过滤数据