2013-10-15 122 views
0

好的,首先我会告诉你应该如何工作:我有一个图像链接的页面,点击图像,该链接的信息出现在另一个div中。我使用jquery/ajax将链接标识发布到一个php文件并将该数据返回给所选的div。 链接应分页,以便一次显示4个。页面加载时的Ajax分页?

这就是发生了什么:后部分是好的,当我点击链接正确的数据显示在选定的div。我不知道如何使链接div分页。我需要他们页面加载时分页,现在当页面加载所有链接显示,然后当我点击一个链接正确的金额(4)显示!

这是我的HTML与2周的div:

<div class="dogsrehomeandrehomed"> 
<?php 
include 'inc/connect.php'; 
$q = mysqli_query($link, "SELECT filename, id, name, age, sex FROM gallery WHERE 
gallery = 1 ORDER BY id DESC") or die (mysql_error()); 
while($row = mysqli_fetch_array($q)){ 
$data = $row['filename']; 
$file = substr($data, strpos($data, "/") + 1); 
echo"<div class='homedogs'>", 
"<a href={$row['id']} class='dogchoice'>", 
"<img class='nailthumb-container3' src='$file' alt='{$row['name']}. Image' />", 
"</a>", 
"<br />", 
'NAME: ',$row['name'],"<br />",'AGE: ',$row['age'],"<br />",'SEX: ',$row['sex'], 
"</div>"; 
} 
?> 
</div> 

<div class="dog"> 
<?php 
include 'inc/connect.php'; 
$q = mysqli_query($link, "SELECT * FROM gallery WHERE gallery = 1 ORDER BY id DESC 
LIMIT 1") or die (mysql_error()); 
while($row = mysqli_fetch_array($q)){ 
$data = $row['filename']; 
$file = substr($data, strpos($data, "/") + 1); 
echo"<div class='rehomediv'>", 
"<img class='nailthumb-container2' src='$file' alt='{$row['name']}. Image' />","<br 
/>", 
"<div class='nameagesex'>", 
'NAME: ',$row['name'],"<br />",'AGE: ',$row['age'],"<br />",'SEX: ',$row['sex'], 
"</div>", 
"<div class='description'>", 
nl2br($row['description']), 
"</div>", 
"</div>"; 
} 
?>   
</div> 
<script src="js/dog.js"></script> 

这是我dog.js文件:

$('a.dogchoice').click(function(e) { 
e.preventDefault(); 
var linkClass = $(this).attr("class"); 
var linkText = new String(this); 
var categoryValue = linkText.substring(linkText.lastIndexOf('/') + 1); 
var params = {}; 
params[linkClass] = categoryValue; 
$.post('inc/dogchoice.php', params, function(data) { 
    var totalRecords = $(data).length; 
    var pageSize = 4; 
    var numOfPages = Math.ceil(totalRecords/pageSize); 
    var i, 
     pageLinks = '<div class="pageLinks">'; 
    for (i = 0; i < numOfPages; i++) { 
     pageLinks += '<a href="#" onclick="showDogLinks(' + i + ');return false;">' + (i 
     + 1) + '<\/a> '; 
    } 
    pageLinks += '<\/div>'; 
    $('.dog').html(pageLinks + data); 
    showDogLinks(0); 
}); 

}); 

//function to slice up records into pages 
function showDogLinks(pageNo) { 
var perPage = 4; 
var start = pageNo * perPage; 
var end = start + perPage; 
$('.homedogs').hide().filter(function(index) { 
    return ((index > (start-1)) && (index < end)); 
}).show(); 
} 

谁能帮助? 感谢您的期待

回答

0

我整理了它。我只用PHP分页链接容器。

感谢您的期待..