旋转表格单元格中的值

时间:2012-02-03 07:28:02

标签: javascript

所以我现在要完成的事实上只是我正在研究的一个小项目的简化版本。我首先要做的是拥有一个包含10行的表,每行包含一个值。 5秒后,函数makeTable将运行并递增每个单元格中的值。现在,我最终得到的是一个无限循环,如果我在内部HTML更改后进行alert / document.write检查,它会不断递增值。

最终,我想用图像替换数字,但如果我至少可以使数字有效,那么我可以在此基础上进行构建。你们给予的任何帮助都会很棒。谢谢!

    <html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<head>

<script type="text/javascript">

document.write("<table>");  
    var i;
    for(i=0;i<10;i++){

        document.write('<tr><td id="Cell' + i + '">'+i+'</td></tr>\n');
    }
    document.write("</table>");


function makeTable(n){
    for(i=n;i<10+n;i++){
        var cell="Cell"+i;  
        document.getElementById(cell).InnerHTML=i+1;

    }   
setTimeout(makeTable(n+1), 5000);
}

setTimeout(makeTable(1), 5000);

</script>
</head>

<body>
</body>
</html>

2 个答案:

答案 0 :(得分:1)

1。)在函数中调用makeTable(...)

setTimeout(function() { makeTable(...); }, 5000);

2.。)从for循环中删除n

for(i=0;i<10;i++) {

3。)InnerHTML必须为innerHTML并添加n

document.getElementById(cell).innerHTML=i+n;

另请参阅this example(在示例中setTimeout(...)将被n缩小,直到function makeTable(n){ for(i=0;i<10;i++){ var cell="Cell"+i; document.getElementById(cell).innerHTML=i+n; } setTimeout(function() { makeTable(n+1); }, 5000); } setTimeout(function() { makeTable(1); }, 5000); 少于5)。

更新:此处更改了代码:

{{1}}

答案 1 :(得分:1)

这段代码应该适合你,编辑:没有恶意:

<html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<head>

</head>

<body>
<script type="text/javascript">
var n = 0;

document.write("<table>");
var i;
for(i=0;i<10;i++){
    document.write('<tr><td id="Cell' + i + '">'+i+'</td></tr>\n');
}
document.write("</table>");



function makeTable(){
    n++;
    for(i=0;i<10;i++){
        var cell="Cell"+i;
        document.getElementById(cell).innerHTML=n + i;
    }

    timer();
}


function timer(){
    setTimeout(makeTable,5000);
}

timer();

</script>

</body>
</html>