jquery和html中的表分页

table pagination in jquery and html

本文关键字：分页 html jquery 更新时间：2023-09-26

我正在尝试对以下代码进行分页。使用JavaScript向表中添加数据。有人能帮我怎么做吗？

任何对代码的添加或重写都会有所帮助。

function onDeviceReady() {
  var queryquery =
    var bestbuy = "";
  jQuery.getJSON(queryquery, function(resultsbestbuy) {
    var productstopdeal = JSON.parse(resultsbestbuy);
    bestbuy += "<div class='"table-container'">" + "<table class='"table table-filter'">";
    for (i = 0; i < productstopdeal.Products.length; i++) {
      bestbuy += "<tbody>" + "<tr>" + "<td>" + "<div class='"ckbox'">" + "<input type='"checkbox'" id='"checkbox1'">" + "<label for='"checkbox1'"></label>" + "</div>" + "</td>" + "<td>" + "<a href='"javascript:;'" class='"star'">" + "<i class='"glyphicon glyphicon-star'"></i>" + "</a>" + "</td>" + "<td>" + "<div class='"media'">" + "<a href=";
      var pId = urlEncode(productstopdeal.Products[i].Id);
      bestbuy += pId;
      bestbuy += " class='"pull-left'">" + "<img src=" + productstopdeal.Products[i].DefaultPictureModel.ImageUrl + " class='"media-photo'" style='"height:120px; width:120px;'">" + "</a>" + "<div>" + "<p>" + "<strong><small><strike>MRP:&nbsp;Rs.&nbsp;" + +"/-" + "</strike><br />Offer&nbsp;price:&nbsp;Rs.&nbsp;" + +"/-<br />You&nbsp;save:&nbsp;Rs.&nbsp;" + +"/-</small></strong>" + "</p>" + "</div>" + "<div class='"media-body'">" + "<p>" + +"</p>" + "</div>" + "<button class='"btn btn-success'" type='"button'" id='"addToCartButton'"><span class='"glyphicon glyphicon-shopping-cart'"></span> BUY NOW</button>" + "</div>" + "</td>" + "</tr>" + "</tbody>" + "</table>";
    }
    bestbuy += "</div>";
    $('#bestBuy').html(bestbuy);
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="bestBuy"></div>

根据我所理解的内容更正了代码。

jQuery.getJSON(queryquery, function (resultsbestbuy) {
    var bestbuy = "";
var productstopdeal = JSON.parse(resultsbestbuy);
bestbuy += "<div class='"table-container'">"
                          + "<table class='"table table-filter'"><tbody>";
for (i = 0; i < productstopdeal.Products.length; i++) {
    bestbuy +=  "<tr>"
                                 + "<td>"
                                        + "<div class='"ckbox'">"
                                        + "<input type='"checkbox'" id='"checkbox1'">"
                                            + "<label for='"checkbox1'"></label>"
                                        + "</div>"
                                    + "</td>"
                                    + "<td>"
                                        + "<a href='"javascript:;'" class='"star'">"
                                            + "<i class='"glyphicon glyphicon-star'"></i>"
                                        + "</a>"
                                    + "</td>"
                                    + "<td>"
                                        + "<div class='"media'">"
                                            + "<a href='";
    var pId = urlEncode(productstopdeal.Products[i].Id);
       bestbuy += pId;
    bestbuy += "' class='"pull-left'">"
                        + "<img src='" + productstopdeal.Products[i].DefaultPictureModel.ImageUrl + "' class='"media-photo'" style='"height:120px; width:120px;'">"
                    + "</a>"
                    + "<div>"
                        + "<p>"
                            + "<strong><small><strike>MRP:&nbsp;Rs.&nbsp;" + +"/-"
                            + "</strike><br />Offer&nbsp;price:&nbsp;Rs.&nbsp;" + + "/-<br />You&nbsp;save:&nbsp;Rs.&nbsp;" + +"/-</small></strong>"
                        + "</p>"
                    + "</div>"
                    + "<div class='"media-body'">"
                        + "<p>" + + "</p>"
                    + "</div>"
                    + "<button class='"btn btn-success'" type='"button'" id='"addToCartButton'"><span class='"glyphicon glyphicon-shopping-cart'"></span> BUY NOW</button>"
                + "</div>"
            + "</td>"
        + "</tr>"
}
bestbuy += "</tbody></table></div>";
$('#bestBuy').html(bestbuy);
});