jquery 分页控件的位置显示。求救！！！！！！
请大家帮帮忙~~~谢谢！我引用了一个jquery分页控件，它能对table中的内容进行分页，下面是jquery代码，引用之后显示第1页第2页的标志是出现在table的上面...
请大家帮帮忙~~~谢谢！我引用了一个jquery分页控件，它能对table中的内容进行分页，下面是jquery代码，引用之后显示第1页第2页的标志是出现在table的上面，我想把它放在table的下方，请问怎么修改，谢谢高手·~~~~
$(function () {
$('table.page').each(function () {
var currentPage = 0;
var numPerPage = 6;
var $table = $(this);
var pageFunction = function () {
$table.find('tbody tr').show()
.slice(0, currentPage * numPerPage)
.hide()
.end()
.slice(((currentPage + 1) * numPerPage - 1) + 1)
.hide()
.end();
} //end of pageFunction()
var num_row = $table.find('tbody tr').length;
var num_pages = Math.ceil(num_row / numPerPage);
var $pager = $('<div></div>');
for (var i = 0; i < num_pages; i++) {
$('<span> 第' + (i + 1) + '页 </span>')
.bind("click", { 'cssrain': i }, function (event) {
currentPage = event.data['cssrain'];
pageFunction();
$(this).addClass('current').siblings().removeClass('current');
})
.appendTo($pager);
}
$pager.insertBefore($table);
$pager.find("span:first").addClass('current');
pageFunction();
})//end of each()
})//enf of function 展开
$(function () {
$('table.page').each(function () {
var currentPage = 0;
var numPerPage = 6;
var $table = $(this);
var pageFunction = function () {
$table.find('tbody tr').show()
.slice(0, currentPage * numPerPage)
.hide()
.end()
.slice(((currentPage + 1) * numPerPage - 1) + 1)
.hide()
.end();
} //end of pageFunction()
var num_row = $table.find('tbody tr').length;
var num_pages = Math.ceil(num_row / numPerPage);
var $pager = $('<div></div>');
for (var i = 0; i < num_pages; i++) {
$('<span> 第' + (i + 1) + '页 </span>')
.bind("click", { 'cssrain': i }, function (event) {
currentPage = event.data['cssrain'];
pageFunction();
$(this).addClass('current').siblings().removeClass('current');
})
.appendTo($pager);
}
$pager.insertBefore($table);
$pager.find("span:first").addClass('current');
pageFunction();
})//end of each()
})//enf of function 展开
1个回答
展开全部
1、在class="page"的table后面加<div class="pagediv"></div>
2、.appendTo($pager);修改为.appendTo(".pagediv");
完整代码：
<table width="100%" border="1" cellspacing="0" cellpadding="0" class="page">
<tr>
<th scope="col"> </th>
<th scope="col"> </th>
<th scope="col"> </th>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<div class="pagediv"></div>
<script type="text/javascript">
$(function () {
$('table.page').each(function () {
var currentPage = 0;
var numPerPage = 6;
var $table = $(this);
var pageFunction = function () {
$table.find('tbody tr').show()
.slice(0, currentPage * numPerPage)
.hide()
.end()
.slice(((currentPage + 1) * numPerPage - 1) + 1)
.hide()
.end();
} //end of pageFunction()
var num_row = $table.find('tbody tr').length;
var num_pages = Math.ceil(num_row / numPerPage);
var $pager = $('<div></div>');
for (var i = 0; i < num_pages; i++) {
$('<span> 第' + (i + 1) + '页 </span>')
.bind("click", { 'cssrain': i }, function (event) {
currentPage = event.data['cssrain'];
pageFunction();
$(this).addClass('current').siblings().removeClass('current');
})
.appendTo(".pagediv");
}
$pager.insertBefore($table);
$pager.find("span:first").addClass('current');
pageFunction();
})//end of each()
})//enf of function
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
