1

我有一个有 20 行的表格,我希望他们的行在页面加载 1 分钟后上升(跳过第一行)。

前任:

  • 最初的

第 1 行 第 2 行 第 3 行

  • 第一节

第 2 行 第 3 行 第 1 行

  • 第二状态

第 3 行 第 1 行 第 2 行

  • 最后一步

第 1 行 第 2 行 第 3 行

我正在做这样的事情,但我不知道如何替换行的内容。如果可能的话,慢慢做(渐进会很好,但现在很重要)

function roll()
 {     
    var oRows = document.getElementById('ultNot').getElementsByTagName('tr');
    var iRowCount = oRows.length;
    //repeat this iRowCount-1?
    for (i=iRowCount; i=2;;i--){
        var tempRow= oRows[i];
        var origRow;
        if (i=rowCount) {
            origRow=oRows[1];
        } else {
            origRow=cRows[i-1];
        }    
         var tempContent=origRow;
         //replace the contents of the rows
    }
 }

非常感谢您的帮助


谢谢Razvan,这成功了。完成我想要的整个代码(即在 40 秒后滚动完整的行组 1 次):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
</head>
<body>
  <table id="ultNot" style="border: 1">
    <tbody>
      <tr>
        <td>First row</td>
      </tr>
      <tr>
        <td>Second row</td>
      </tr>
      <tr>
        <td>Third row</td>
      </tr>
      <tr>
        <td>Fourth row</td>
      </tr>
      <tr>
        <td>Fifth row</td>
      </tr>
    </tbody>
  </table>
  <input type="button" onclick="iniciaScroll()" value="Click" />
  <script type="text/javascript">
    window.setTimeout(function() {
        iniciaScroll();
        ;
    }, 40000);
  </script>
  <script type="text/javascript">
    var interval;
    var cont = 0;
    var sizeTable = document.getElementById('ultNot').rows.length;
    function roll() {
        var table = document.getElementById('ultNot');
        var rows = table.rows;
        var firstRow = rows[1];
        var clone = firstRow.cloneNode(true);
        table.tBodies[0].appendChild(clone);
        table.tBodies[0].removeChild(firstRow);
        cont++;
        if (cont == (sizeTable - 1)) {
            clearInterval(interval);
            cont = 0;
        }
    }
    function iniciaScroll() {

        interval = window.setInterval(function() {
            roll();
        }, 3000);
    }
  </script>
  <!-- end: portal_latestthreads -->
</body>
</html>
4

1 回答 1

1

可能有更好的方法,但这是我到目前为止所能想到的:)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
  <script type="text/javascript">
    function roll() {
      var table = document.getElementById('myTable');
      var rows = table.rows;
      var firstRow = rows[0];
      var clone = firstRow.cloneNode(true);
      table.tBodies[0].appendChild(clone);
      table.tBodies[0].removeChild(firstRow);
    }
  </script>
</head>
<body>
  <table id="myTable" style="border: 1">
    <tbody>
      <tr><td>First row</td></tr>
      <tr><td>Second row</td></tr>
      <tr><td>Third row</td></tr>
      <tr><td>Fourth row</td></tr>
      <tr><td>Fifth row</td></tr>
    </tbody>
  </table>
  <input type="button" onclick="roll()" value="Click"/>
</body>
</html>
于 2012-11-20T16:36:29.280 回答