我想在每一行和每一列中生成随机数。我这样写在下面。它只生成两行。我想创建 4*4 数独。这样我就这样给了
<script type="text/javascript">
var random1, random2, random3, random4;
var randomArray = [0,0,0,0];
//sets array variables to random numbers
function CreateLottoValues() {
for (var i=0; i<randomArray.length; i++) {
randomArray[i] = Math.floor(Math.random()*4 + 1);
}
}
}
//create table
function UpdateTable() {
CreateLottoValues();
for (var i=0; i<randomArray.length; i++) {
tmp = 'cell'+(i+1);
document.getElementById(tmp).innerHTML = randomArray[i];
}
}
</script>
</head>
<body onload="UpdateTable();">
<center>
<div id="container">
<div id="header"> <h1>Welcome</h1> </div>
<div id="content">
<span id="tableSpan">
<table border="1" id="lotto">
<tr>
<td class="normal" id="cell1"> </td>
<td class="normal" ><input type="text" name=""></td>
<td class="normal" > </td>
<td class="red" id="cell4"> </td>
</tr>
<tr>
<td class="normal" id="cell1"> </td>
<td class="normal" id="cell2"> </td>
<td class="normal" id="cell3"> </td>
<td class="red" id="cell4"> </td>
</tr>
<tr>
<td class="normal" id="cell1"> </td>
<td class="normal" id="cell2"> </td>
<td class="normal" id="cell3"> </td>
<td class="red" id="cell4"> </td>
</tr>
<tr>
<td class="normal" id="cell1"> </td>
<td class="normal" id="cell2"> </td>
<td class="normal" id="cell3"> </td>
<td class="red" id="cell4"> </td>
</tr>
</table>
</span>
<input type="button" value="Re-generate Numbers" onclick="UpdateTable();" />
请帮我在所有行和列中生成随机数。提前致谢。
最佳答案
确保您的 HTML 中有唯一的 Id。
同时避免使用内联事件。使用 javascript 绑定(bind)事件，这更加简洁并且可以分离您的顾虑。
HTML
<center>
<div id="container">
<div id="header">
<h1>Welcome</h1>
</div>
<div id="content">
<table border="1" id="lotto">
<tbody>
<tr>
<td class="normal" id="cell00"> </td>
<td class="normal" id="cell01"> </td>
<td class="normal" id="cell02"> </td>
<td class="red" id="cell03"> </td>
</tr>
<tr>
<td class="normal" id="cell10"> </td>
<td class="normal" id="cell11"> </td>
<td class="normal" id="cell12"> </td>
<td class="red" id="cell13"> </td>
</tr>
<tr>
<td class="normal" id="cell20"> </td>
<td class="normal" id="cell21"> </td>
<td class="normal" id="cell22"> </td>
<td class="red" id="cell23"> </td>
</tr>
<tr>
<td class="normal" id="cell30"> </td>
<td class="normal" id="cell31"> </td>
<td class="normal" id="cell32"> </td>
<td class="red" id="cell33"> </td>
</tr>
</tbody>
</table>
</div>
</div>
<input id="btn" type="button" value="Re-generate Numbers" />
</center>
JS
var btn = document.getElementById('btn');
btn.addEventListener('click', UpdateTable);
// Set the max length of random number
// and the max length
var maxLength = 4;
// You don't require an empty array here
// to populate the list of random numbers.
// Returns a random number
function CreateLottoValues() {
return Math.floor(Math.random() * 4 + 1);
}
//create table
function UpdateTable() {
// Iterate over each cell and set a random number
for (var i = 0; i < maxLength; i++) {
for (var j = 0; j < maxLength; j++) {
tmp = 'cell' + i + j;
document.getElementById(tmp).innerHTML = CreateLottoValues();
}
}
}
UpdateTable();
Check Demo
关于javascript - 如何在每行和每列中生成随机数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18159394/