jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了同一页面中的两个jquery分页插件似乎不起作用大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用 jquery分页插件进行分页…如果有一个分页插件对我没有问题…但如果有两个似乎工作但另一个似乎也没有…这是我的代码,

<div id="PagerUp" class="pager">

</div><br /><br /><br />
    <div id="ResultsDiv">

</div>
<div id="PagerDown" class="pager">

</div>

我的jquery有,

<script type="text/javascript">
         var itemsPerPage = 5;
         $(document).ready(function() {
             getRecordspage(0,itemsPerPage);
             var maxvalues = $("#HfId").val();
             $(".pager").pagination(maxvalues,{
                 callback: getRecordspage,current_page: 0,items_per_page: itemsPerPage,num_display_entries: 5,next_text: 'Next',prev_text: 'Prev',num_edge_entries: 1
             });
         });

</script>

这是我得到的……

alt text http://img52.imageshack.us/img52/5618/pagerse.jpg

两者都有效但看看pagerup所选页面是3但是PagerDown显示1 ….如何在jquery中更改其他寻呼机上的一个寻呼机回调事件….

编辑:
使用mef的想法似乎不起作用……

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="jquery.js"></script>
    <link rel="Stylesheet" type="text/css" href="CSS/Main.css" />
      <script type="text/javascript" src="Javascript/jquery.pagination.js">
      </script>
    <script type="text/javascript">
        $(document).ready(function() {
            $(".pager").pagination(300,{ callback: pagecallback,items_per_page: 5,num_edge_entries: 1
            });
        });
    function pagecallback() {
        var paginationClone = $("#Pagination > *").clone(true);
        $("#Pagination2").empty();
        paginationClone.appendTo("#Pagination2");
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>

<div class="pager" id="pagination">
  <!-- the container for your first pagination area -->
</div>

<div id="results">
  <!-- the container where you show your results -->
</div>

<div class="pager" id="Pagination2">
  <!-- the container for your second pagination area -->
</div>
    </div>
    </form>
</body>
</html>

解决方法

由于这似乎没有得到官方支持,这里有一个解决方法( working demo).

步骤1
创建HTML标记,如下所示:

<div class="pagination" id="Pagination">
  <!-- the container for your first pagination area -->
</div>

<div id="results">
  <!-- the container where you show your results -->
</div>

<div class="pagination" id="Pagination2">
  <!-- the container for your second pagination area -->
</div>

第2步这个想法:
现在的想法是像往常一样使用分页插件和第一个分页div.但另外,我们希望每次发生页面更改时将第一个分页div的所有内容复制到第二个分页div.

步骤3调整pageSelect-callback:
在回调函数的末尾添加以下行:

var paginationClone = $("#Pagination > *").clone(true);
$("#Pagination2").empty();
paginationClone.appendTo("#Pagination2");

使用.clone调用包含布尔参数(withDataAndEvents)非常重要,否则您的分页副本将不会有任何单击事件.

现在,每次单击分页元素(无论它是原始元素还是副本),页面都将更改,分页元素将相应更新.

大佬总结

以上是大佬教程为你收集整理的同一页面中的两个jquery分页插件似乎不起作用全部内容,希望文章能够帮你解决同一页面中的两个jquery分页插件似乎不起作用所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: