Question

我有一个包含此特定数组的函数。

var elementsArray = xmlDocument.documentElement.getElementsByTagName('track');
        // console.log(elementsArray);
        var arrayLength = elementsArray.length;
        var output = "<table>";
        for (var i=0; i < arrayLength; i++)
        {
          var title = elementsArray[i].getElementsByTagName('title')[0].firstChild.nodeValue;
          var artist = elementsArray[i].getElementsByTagName('artist')[0].firstChild.nodeValue;
          var length = elementsArray[i].getElementsByTagName('length')[0].firstChild.nodeValue;
          var filename = elementsArray[i].getElementsByTagName('filename')[0].firstChild.nodeValue;
          console.log(title + '  ' + artist + '  ' + length + '  ' + filename);
          output += "<tr>";
          output += ("<td onclick='songSelect(\"" + filename + "\")'>" + title + "</td><td>" + artist + "</td>");
          output += "</tr>";
        }

使用此数组，我将如何生成上一个和下一个要移动的按钮。 http://jsfiddle.net/xbesjknL/

Answer 1

一旦可以使用链表，甚至可以使用指向prev / curr / next轨道的类C指针的概念。但唉，这是Javascript，客户端也处理负担过重。

所以你可以在像对象一样的光标中建立你自己的简化指针，它总是指向当前轨道的索引，前一个轨道的索引和下一个索引。每当用户点击上一个或下一个按钮时，你就会调用刷新方法来相应地更新光标的指针。

var cursor = { 
  prev:(elementsArray.length-1), 
  curr:0, 
  next:(1 % (elementsArray.length-1)),

  refresh: function(button){ //button is either the btnPrev or btnNext elements
    if (button.getAttribute("id") === "btnPrev") {
      old_curr = this.curr;
      this.curr = this.prev;
      if ((this.curr-1) < 0)
        this.prev = elementsArray.length-1;
      else    
        this.prev = this.curr - 1;
      this.next = old_curr;
    } else {
      old_curr = this.curr;
      this.curr = this.next;
      if ((this.curr+1) > (elementsArray.length-1))
        this.next= 0;
      else
        if (elementsArray.length === 1)
          this.next = 0;
        else
          this.next = this.curr+1;
      this.prev = old_curr;
    }
  }
};

// example usage:
cursor.refresh(btnPrev);
elementsArray[cursor.curr]; // gives the previous track, which is now the current track

您甚至可以通过仅跟踪当前曲目来进一步简化此操作。注意

如何为数组生成上一个和下一个按钮？

1 个答案: