用AJAX网址分页

时间:2013-08-02 10:52:04

标签: javascript jquery html ajax

我是AJAX& amp; JS所以请耐心等待。

我使用这个AJAX进行分页:

 $(function () {
     var keyword = window.localStorage.getItem("keyword");

     //pagination
     var limit = 3;
     var page = 0;
     var offset = 0;

     $("#btnLoad").on('click', function () {
         page++;
         if (page != 0)
             offset = (page - 1) * limit;

         $.ajax({
             url: "http://localhost/jwmws/index.php/jwm/search/msmall/" + keyword + "/" + limit + "/" + offset, //This is the current doc
             type: "GET",
             error: function (jq, st, err) {
                 alert(st + " : " + err);
             },
             success: function (result) {
                 alert("offset=" + offset + " page =" + page);
                 //generate search result
                 $('#search').append('<p style="float:left;">Search for : ' + keyword + '</p>' + '<br/>' + '<p>Found ' + result.length + ' results</p>');

                 if (result.length == 0) {
                     //temp
                     alert("not found");
                 } else {
                     for (var i = 0; i < result.length; i++) {
                         //generate <li>
                         $('#list').append('<li class="box"><img class="picture" src="images/HotPromo/tagPhoto1.png"/><p class="name"><b>Name</b></p><p class="address">Address</p><p class="hidden"></p></li>');
                     }

                     var i = 0;
                     $(".box").each(function () {
                         var name, address, picture, id = "";
                         if (i < result.length) {
                             name = result[i].name;
                             address = result[i].address;
                             picture = result[i].boxpicture;
                             id = result[i].mallid;
                         }

                         $(this).find(".name").html(name);
                         $(this).find(".address").html(address);
                         $(this).find(".picture").attr("src", picture);
                         $(this).find(".hidden").html(id);
                         i++;
                     });

                     $(".box").click(function () {
                         //alert($('.hidden', this).html());
                         window.localStorage.setItem("id", $('.hidden', this).html());
                         $("#pagePort").load("pages/MallDetail.html", function () {});
                     });

                 }
             }
         });
     }).trigger('click');

 });

请注意,我在url:中使用变量进行分页。我试图提醒页面和偏移变量,它的工作正常。

但是,AJAX仅适用于第一页(当页面加载时)。即使页面和偏移量变量的值为真,其余部分也不起作用。

控制台中没有警告/错误。数据没有显示。

感谢任何帮助,谢谢:D

1 个答案:

答案 0 :(得分:-1)

当缺少整个HTML时,调试代码有点困难。 您可以将代码放入JSFiddle,包括HTML和JS。