关于jquery.pagination.js分页的问题,老报错是怎么回事

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于jquery.pagination.js分页的问题,老报错是怎么回事相关的知识,希望对你有一定的参考价值。

$(function ()
function pageselectCallback(page_id, jq)
//alert(page_id);

$("#fenye").pagination(<%=itemcount%>,
callback: pageselectCallback,//PageCallback() 为翻页调用次函数。
prev_text: " 上一页",
next_text: "下一页 ",
items_per_page: <%=pageCount %>, //每页的数据个数
num_display_entries: 3, //两侧首尾分页条目数
current_page: <%=itempage%>, //当前页码
num_edge_entries: 2, //连续分页主体部分分页条目数
link_to:"?serverpage=__id__&"
);
);

运行的时候总是提示对象不支持pagination属性或方法

我也是啊,但个页面可以,放到mvc index中就是不行。

------------------------------------------------------------------------

我刚才出来效果了。

我用的MVC4. 

一、先在BundleConfig.cs中 引入css 和 jpaginate

   //分页脚本

            bundles.Add(new ScriptBundle("~/bundles/jPaginate").Include("~/Content/jPaginate/jquery.paginate.js"));

            //分页样式            

            bundles.Add(new StyleBundle("~/bundles/jPaginateCss").Include("~/Content/jPaginate/css/style.css"));

二、 在再layout中 加入:

  @Styles.Render("~/bundles/jPaginateCss")
  @Scripts.Render("~/bundles/jquery")
  @Scripts.Render("~/bundles/jPaginate")

 注意吧jquery的提前了

 三、 然后再 Index 中

@
    ViewBag.Title = "Index";

<h2>Index</h2>
<div class="demo">
                <h1>Demo 4</h1>
                <div id="demo1">                   
                </div>
            </div>
<script>
   
    $(function () 
        $("#demo1").paginate();
    );
</script>

这是默认的风格,然后自己去调吧  刚试出来的 

参考技术A JS没有引入进来.追问

已经引入了

追答

看下路径是否正确,把这样的变量先写死一个值试试,确认pagination方法 是传入两个参数吗?

jquery分页

  1 <script src="../../js/jquery-3.2.1.min.js"></script>
  2 <script src="../../js/jquery.pagination.js"></script>
  3 
  4 <script>
  5 $(function () {
  6     getPage();
  7 });
  8 //    分页
  9 function getPage() {
 10     var user = JSON.parse(sessionStorage.getItem(‘user‘));
 11     var token = user.token;
 12     $.ajax({
 13         url: PROJECTLIST,
 14         type: ‘get‘,
 15         data: {
 16             page: 0,
 17             pageSize: 100
 18         },
 19         dataType: ‘json‘,
 20         beforeSend: function (request) {
 21             request.setRequestHeader("token", token);
 22         },
 23         success: function (data) {
 24             if (data.code==401){
 25                 alert("请重新登录");
 26                 top.location.href="../login/login.html";
 27                 return false;
 28             }
 29 
 30             let pn = 1;         //当前页数
 31             let count = data.data.totalElements;    //总条数
 32             let size = 5;       //每页显示的个数
 33             let total = Math.ceil(count/size);      //总共多少页
 34             //  根据总页数添加li 索引
 35             for (var i =0;i<total;i++){
 36                 $(‘.table_mess tbody‘).append("<tr>"+(i+1)+"</tr>")
 37             }
 38             gotoPage(pn);
 39 
 40             // 点击数字
 41             $(".paginatin-wrapper").click(function(event) {
 42                 pn=$(".M-box1 .active").text();
 43                 gotoPage(pn);
 44             });
 45         }
 46     });
 47 }
 48 //    根据页数展示数据
 49 function gotoPage(pn) {
 50     getData(pn);
 51 }
 52 //    获取数据列表
 53 function getData(pn) {
 54     var user = JSON.parse(sessionStorage.getItem(‘user‘));
 55     var token = user.token;
 56     var item;
 57     $.ajax({
 58         url: PROJECTLIST,
 59         type: ‘get‘,
 60         data: {
 61             page: 0,
 62             pageSize: 100
 63         },
 64         dataType: ‘json‘,
 65         beforeSend: function(request) {
 66             request.setRequestHeader("token", token);
 67         },
 68         success: function (data) {
 69             if (data.code == 200){
 70                 var count = data.data.totalElements;// 总条数
 71                 var size = 5;        // 每页显示条数
 72                 var total =Math.ceil( count / size ); //总页数
 73                 var yu = count%size;  // 得到总数除每页显示个数的余数
 74                 var linum = size;
 75                 var startPage = size*(pn-1);
 76                 var endPage = startPage+size-1;
 77 
 78                 var $tbody = $(".table_mess tbody");
 79                 $tbody.empty();
 80                 if (pn==total) {  //如果是最后一页就添加余下个数的li
 81                     linum=yu;
 82                 }
 83                 for (var i = 0; i < linum; i++) {
 84                     $tbody.append(‘<tr class="li-tag"></tr>‘);
 85                 }
 86                 var items = data.data.data;
 87                 if (items.length>0){
 88                     if (total==1){
 89                         for (var i=0;i<count;i++){
 90                             var pic = items[i].picture.split(",");
 91                             var nav = `
 92                                         <td>${items[i].name}</td>
 93                                         <td>
 94                                             <span>
 95                                                 <i class="mess_lab">所属小区:</i>
 96                                                 <i class="name">${items[i].ssxq}</i>
 97                                             </span>
 98                                             <span>.........</span>
 99                                         </td>
100                                         <td>
101                                             <span>
102                                                 <i class="mess_lab">总面积:</i>
103                                                 <i class="name">${items[i].zmj}</i>
104                                             </span>
105                                             <span>.........</span>
106                                         </td>
107                                         <td><img src="${pic[0]}" ></td>
108                                         <td>
109                                             <a onclick="lookmore(${i})" href="javascript: void(0)">查看详情</a>
110                                             <a href="#">删除</a>
111                                         </td>
112                                 `
113 
114                             $(".li-tag").eq(i).append(nav);
115                         }
116                     } else {
117                         for (var j = startPage,k=0;j<endPage,k<size;j++,k++){
118                             if (j==count){break;}
119                             var pic = items[j].picture.split(",");
120                             var nav = `
121                                         <td>${items[j].name}</td>
122                                         <td>
123                                             <span>
124                                                 <i class="mess_lab">所属小区:</i>
125                                                 <i class="name">${items[j].ssxq}</i>
126                                             </span>
127 
128 
129                                             <span>.........</span>
130                                         </td>
131                                         <td>
132                                             <span>
133                                                 <i class="mess_lab">总面积:</i>
134                                                 <i class="name">${items[j].zmj}</i>
135                                             </span>
136                                             <span>.........</span>
137                                         </td>
138                                         <td><img src="${pic[0]}" ></td>
139                                         <td>
140                                             <a onclick="lookmore(${j})" href="javascript: void(0)">查看详情</a>
141                                             <a href="#">删除</a>
142                                         </td>
143                                 `
144                             $(".li-tag").eq(k).append(nav);
145                         }
146                     }
147                     $(‘.M-box1‘).pagination({
148                         pageIndex: 2,
149                         totalData: count,
150                         showData: 5,
151                         current: pn,
152                         coping: true
153                     });
154                 }else {
155                     $(‘.table_mess tbody‘).html("暂无数据")
156                 }
157             }else if (data.code==401){
158                 alert("请重新登录");
159                 top.location.href="../login/login.html";
160                 return false;
161             }
162         }
163     });
164 }
165 </script>

 

以上是关于关于jquery.pagination.js分页的问题,老报错是怎么回事的主要内容,如果未能解决你的问题,请参考以下文章

jquery.pagination.js分页使用教程

jQuery 分页插件(jQuery.pagination.js)ajax 实现分页

jquery.pagination.js 分页插件,一直执行回调方法,死循环了

jquery分页

ul/ol列表分页

jquery.pagination.js添加跳转页