在表内生成随机元素

时间:2016-03-24 12:41:02

标签: jquery html

我创建了一个9x9表。我已经用一些数字填充了它。我还用bgcolor突出显示了第1行和第1列,并且它将保持固定,即它没有被洗牌。

这是我的代码:

<table border="2px" width="300px"id="mytable" >
<tr bgcolor="#FF0000">
<td></td>
<td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td>
<td>8</td></tr>
<tr >
<td bgcolor="#FF0000">1</td><td>5</td><td>6</td><td>1</td><td>7</td> <td>8</td><td>3</td>
<td>2</td><td>4</td>
</tr>
<tr>
<td bgcolor="#FF0000">2</td><td>3</td><td>4</td><td>7</td><td>8</td><td>5</td><td>1</td>
<td>6</td><td>2</td>
</tr>
<tr>
<td bgcolor="#FF0000">3</td><td>1</td><td>3</td><td>4</td><td>2</td><td>6</td><td>7</td>
<td>8</td><td>5</td></tr>
<tr>
<td bgcolor="#FF0000">4</td><td>2</td><td>4</td><td>7</td><td>5</td><td>1</td><td>3</td>
<td>8</td><td>6</td></tr>
<tr>
<td bgcolor="#FF0000">5</td><td>8</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td>
<td>2</td><td>1</td></tr>
<tr>
<td bgcolor="#FF0000">6</td><td>2</td><td>6</td><td>3</td><td>5</td><td>1</td><td>4</td>
<td>8</td><td>7</td>
</tr>

<tr>
<td bgcolor="#FF0000">7</td><td>1</td><td>3</td><td>5</td><td>8</td><td>6</td><td>7</td>
<td>2</td><td>4</td>
</tr>
<tr>
<td bgcolor="#FF0000">8</td><td>2</td><td>1</td><td>4</td><td>5</td><td>8</td><td>7</td>
<td>6</td><td>3</td>
</tr>
</table>

jQuery的:

$(document).click(function(){
var $firstCells = $("#mytable tr:not(:first-child) td:not(:first-child)"),
    $copies = $firstCells.clone(true);

[].sort.call($copies, function() { return Math.random() - 0.5; });

$copies.each(function(i){
    $firstCells.eq(i).replaceWith(this);
});

});

但这只有在我点击它时才有用。如何在不点击它的情况下洗牌。有谁能告诉我?

1 个答案:

答案 0 :(得分:0)

尝试使用$(function(){〜而不是$(document).click(function(){〜

这将使文档在文档准备好后立即运行。

相关问题