用於循環的JavaScript不改變鏈接文本

我在for循環中有一個嵌套for循環，它應該將鏈接文本更改爲1到5之間的一個隨機數。鏈接的ID是「aX_Y」，X和Y數字。鏈接排列在一個4x3的廣場上。問題是，對於鏈接文本的隨機數只顯示最後一行：用於循環的JavaScript不改變鏈接文本

<!DOCTYPE html> 
<html> 
<head> 
<title>RISK</title> 
<style type="text/css" media="screen"> 
    a:link, a:visited {color: #eee;border:3px solid #ccc;text-decoration:none;padding:20px;} 
    .one {background: #7B3B3B;} 
    .two {background: #547980;} 
    #status {color: #eee;padding:1px;text-align:center} 
    .current {border:3px solid #000;} 
</style> 
<script type="text/javascript" charset="utf-8"> 
var xTurn = true; 
var gameOver = false; 
var numMoves = 0; 

function newgame() 
{ 
    var status = document.getElementById('status'); 
    numMoves = 0; 
    gameOver = false; 
    xTurn = true; 
    status.innerHTML = 'Player One\'s turn'; 

    for(var x = 0; x < 4; x++) 
    { 
     for(var y = 0; y < 3; y++) 
     { 
      document.getElementById('a' + x + '_' + y).innerHTML = Math.floor(Math.random()*5 + 1); 
      console.log('a' + x + '_' + y); 
     } 
    } 
} 
function current(selected) 
{ 
    var status = document.getElementById('status'); 
    var value = selected.value; 
} 
//document.getElementById("status").setAttribute("class", "two"); 
</script> 
<meta name="viewport" content="user-scalable=no, width=device-width" /> 
</head> 

<body onload='newgame();'> 
<p id="status" class="one">Player One's turn</p> 
<br /> 
<a href="#" id="a0_0" class="one current" onclick="current(this);"></a> 
<a href="#" id="a1_0" class="two" onclick="current(this);"></a> 
<a href="#" id="a2_0" class="two" onclick="current(this);"></a> 
<a href="#" id="a3_0" class="two" onclick="current(this);"></a> 
<br /> 

<a href="#" id="a0_1" class="two" onclick="current(this);"></a> 
<a href="#" id="a1_1" class="two" onclick="current(this);"></a> 
<a href="#" id="a2_1" class="two" onclick="current(this);"></a> 
<a href="#" id="a3_1" class="two" onclick="current(this);"></a> 
<br /> 

<a href="#" id="a0_2" class="two" onclick="current(this);"></a> 
<a href="#" id="a1_2" class="two" onclick="current(this);"></a> 
<a href="#" id="a2_2" class="two" onclick="current(this);"></a> 
<a href="#" id="a3_2" class="two" onclick="current(this);"></a> 
<br /><br /> 

<p><input type="button" id="newgame" value="New Game" onclick="newgame();" /></p> 
</body> 
</html>

這裏是直接鏈接到它：

https://dl.dropbox.com/u/750932/iPhone/risk.html

來源

2010-01-01 Raptrex

這一變化讓你的CSS修復該問題：

a:link, a:visited 
{ 
    color: #eee; 
    border:3px solid #ccc; 
    text-decoration:none; 
    display:inline-block; 
    padding:20px; 
}

來源

2010-01-01 05:39:19 ChaosPandion

嘿，我敢肯定它是工作...其他箱子只是在前面的重疊，你不能看到它們。 Firebug顯示所有框內的值。

a { 
    display:block; 
    float:left; 
} 

br { 
    clear:both; 
}

...雖然實際上那些頂級元素不應該被重新設計不一定這樣，我把它們都放在一個<div id="game"></div>，使他們.game a和.game br。

來源

2010-01-01 05:35:19 spinn

（在Firefox測試）

你的JavaScript代碼是好的;所有的網格正方形都填充了隨機數。我所看到的是每行鏈接都與前一行重疊，因此前一行中的數字被隱藏起來。

重疊故意？

來源

2010-01-01 05:37:15 ZoogieZork

正在正確生成所有隨機數。由於您的CSS規則，前兩行只是隱藏起來。您可以通過下面的CSS變化證明了這一點：

變化，看起來像這樣的行：

a:link, a:visited {color: #eee;border:3px solid #ccc;text-decoration:none;padding:20px;}

這樣：

a:link, a:visited {color: #eee;border:3px solid #ccc;text-decoration:none;}

瞧，這是所有工作精美。

來源

2010-01-01 05:37:58 Asaph

用於循環的JavaScript不改變鏈接文本

回答

相關問題