无法在分页中工作
[英]Can't get pagination to work in a div
问题描述
我有一个页面显示产品图片。 我下面有用于Description ， Contact Details和Comments选项卡。 单击“ Comments选项卡时，将使用Jquery将注释页面加载到div="info"中。
products.php：
<html>
<head></head>
<body>
<img src="image.jpg">
<hr>
<a id="det"><h3>Details</h3></a>  <a id="contact"><h3>Contact</h3></a>
 <a id="comments"><h3>Comments</h3></a>
<div id="info"></div>
</body>
<html>
jQuery：
<script>
$(document).ready(function(){
$("#comments").click(function(){
$("#info").load("comments.php");
});
});
</script>
下面的comment.php页面使用分页进行注释。
当我单击分页链接时，页面会刷新comments.php?page=*从div="info"删除它。如何在使用pagination时将注释保留在div id="info" ？
comments.php：
<?php
// 1)Set current page
$current_page = ((isset($_GET['page']) && $_GET['page'] > 0) ?
(int)$_GET['page'] : 1);
require 'connect.php';
// 2)Get total amount of rows
$sql = "SELECT * FROM comments";
$result=mysqli_query($conn,$sql);
$totalrows = mysqli_num_rows($result);
// Offset - calculation to skip to the data you want to display
$results_per_page = 10;
$offset = ($current_page-1)*$results_per_page;
?>
/*------- Comments Form -----*/
/*------- Comments from Database ---- */
<?php
//Here is the code for displaying link and page number.
$number_page = $totalrows/$results_per_page;
for ( $page = 1; $page <= $number_page; $page ++ )
{
echo "<a href='comments.php?page={$page}'>{$page}</a>";
}
?>
2 个解决方案
解决方案1
1 2015-07-14 16:00:31
您需要将click事件附加到ajax部分中加载的链接。 最简单的方法是将类属性添加到要通过ajax加载的任何链接上，然后将事件附加到该类上。
例：
<?php
// example just increments the page param
if(strtolower(filter_input(INPUT_SERVER, 'HTTP_X_REQUESTED_WITH', FILTER_SANITIZE_STRING)) == 'xmlhttprequest') {
die('<a class="ajaxlink" href="?page='.($_GET['page']+1).'">Goto page '.($_GET['page']+1).'</a>');
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<h3><a class="ajaxlink" href="index.php">Contact</a></h3>
<div id="info"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
$(document).on("click", ".ajaxlink", function(event) {
event.preventDefault();
if ($(this).prop('href').length > 0) {
$("#info").load($(this).prop('href'));
}
return false;
});
</script>
</body>
</html>
解决方案2
1 已采纳 2015-07-14 17:02:59
您知道...可以通过执行js使#info元素内的每个链接仅在其中进行更新来解决此问题。 不确定是否是您所需要的。
$('#info').on('click', 'a', function (e){
e.preventDefault();
$("#info").load($(this).attr('href'));
});
无法获得分页以使用WP_query
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.