Question

我无法理解这个问题。我有一个让我们说150项的数组。我只想一次显示50个。所以，我会在显示屏的末尾有一个按钮，上面写着：“显示51-100”。 OnSubmit这个按钮，javascript代码显示51-100。 Ditto，接下来50.建议最感谢！

         for(var i = 0; i < myArray.length; i++ ){
     document.getElementById("comment" + i).innerHTML = commentBody;

}

需要编写项目的HTML：

    <div style="clear:both"> <br> </div>
    <div  id="flapBox13" class="flapBox">
      <p id='whenFlap13' class="mscFlapTime"></p> 
      <b  id='flapSum13' class="mscFlapSumBold"></b>    
      <p     id='flap13' class="mscFlapText"></p>            
    </div>

Answer 1

// part是一个数字

function displayArrayPart(myFullArray, part){

  var partToDisplay = part;
  var partOfArray = '';

  for(i=0+(partToDisplay*50);i<50+(partToDisplay*50);i++)
  {
    partOfArray+= 'someHtml'+myFullArray[i]+'someHtml';
  }
  $("#idFromMyHtmlElementWhereIsDisplayedTheArray").html(partOfArray); //jquery

}

Answer 2

假设您有150个项目的列表。让我们给它一个自生名称list。首先，我们将编写一个函数将列表分成几个列表：

function take(n, list) {
    return list.slice(0, n);
}

function drop(n, list) {
    return list.slice(n);
}

function concat(lists) {
    return Array.prototype.concat.apply(this, lists);
}

function divide(n, list) {
    if (list.length) {
        var head = take(n, list);
        var tail = drop(n, list);
        return concat.call([head], [divide(n, tail)]);
    } else return [];
}

现在我们将list分成每个50个元素的页面：

var pages = paginate(50, list);

function paginate(n, list) {
    return divide(n, list).map(function (items, index) {
        var number = n * index;

        return {
            start: number + 1,
            end: number + items.length,
            items: items
        };
    });
}

现在让我们看一些HTML：

<h2 id="pageHeader"></h2>
<ol id="pageItems"></ol>
<div id="pageButtons"></div>

现在已经开始了，让我们再写一些JavaScript：

var header = document.getElementById("pageHeader");
var items = document.getElementById("pageItems");

function displayPage(page) {
    header.innerHTML = "Items " + page.start + " to " + page.end + ":";

    items.start = page.start;

    items.innerHTML = "";

    appendChildren(items, page.items.map(function (item) {
        var li = document.createElement("li");
        li.innerHTML = item;
        return li;
    }));
}

function appendChildren(element, children) {
    children.forEach(function (child) {
        element.appendChild(child);
    });
}

我们默认会显示第一页：

displayPage(pages[0]);

接下来我们将创建一堆按钮：

var buttons = document.getElementById("pageButtons");

appendChildren(buttons, pages.map(function (page, index) {
    var button = document.createElement("button");
    button.addEventListener("click", display);
    button.innerHTML = index + 1;
    return button;

    function display() {
        displayPage(page);
    }
}));

这就是所有人。请亲自查看演示：http://jsfiddle.net/EHfn3/

如何遍历javascript数组并仅显示数组的一部分然后重复

2 个答案: