如何通过使用 onClick() 函数单击按钮来填充 Javascript 中的表格？

Posted 2023-02-22

【中文标题】如何通过使用 onClick() 函数单击按钮来填充 Javascript 中的表格？

【英文标题】：How do I populate a table in Javascript by clicking a button using the onClick() function?

【发布时间】：2013-05-07 02:13:45

【问题描述】：

使用 javascript，我想在 soduku.setstring() 中填充数字；一旦用户单击“Easy”按钮，进入表格。如何使用 onClick() 函数实现这一点？

function initialize() 
var col, row;
for (row = 0; row <=8; row++) 
for (col=0; col <= 8; col++) 
var cell = document.getElementById('cell_' + col + '_' + row);
if (!parseInt(cell.innerhtml)) 
// cell is empty
cell.onclick = selectCell;
cell.className = 'tofill';



document.onkeypress = keyPress;


function easygame()

    var sudoku.setString("240057360000008009378000200060041702080000005000005010130000000050003026000812000");
    loadPuzzle(sudoku);
    updateUI();


function updateUI()
    initialize();




<input type="button" value="Easy" onclick="easygame()"/>
<table align=center id="sudoku" cellspacing=0>
<tr>
<td id="cell_0_0"></td>
<td id="cell_1_0"></td>
<td id="cell_2_0"></td>
<td id="cell_3_0"></td>
<td id="cell_4_0"></td>
<td id="cell_5_0"></td>
<td id="cell_6_0"></td>
<td id="cell_7_0"></td>
<td id="cell_8_0"></td>
<tr>

【问题讨论】：

如果您发布一些您尝试过的代码，而不是仅仅询问如何做，您会得到人们更好的回应。我们希望您问的问题是“我该如何修复这个？”

通过id查找表，然后循环遍历其td元素并将相关的数组值放入其中

@sachleen 到目前为止，我一直在手动输入每个单元格的值，但后来我认为拥有一个允许用户单击的按钮会更容易。并单击一个函数将数字加载到每个单元格的表格中。我只是不知道如何从 Javascript 脚本的角度来解决这个问题。

@user1883386 ：当然，如果您的代码不起作用，我们将能够为您提供帮助。但是我们不能为您从头开始编写代码。尝试一下并在此处发布。

@T0X1C 我创建了一个初始化过程，该过程在加载时发生并查看表中的所有单元格。然而，我试图创建一个几乎做同样事情的更新函数，但目的是，一旦用户点击 Easy 按钮，easygame() 函数将被激活，然后更新将在之后发生。问题是这并没有发生。有什么帮助吗？

【参考方案1】：

对于数独，为什么不使用二维数组。它在逻辑上比使用字符串更容易。就您的问题而言，您可以使用 jQuery 来填写这样的表格，

for(var i=0;i<81;i++)

    $('table#sudoku td:eq('+i+')').text(sudokuString[i]);