Javascript 使用jQuery动态添加表行和列

我正在尝试使用用户输入值向表中添加行和列，以使用jQuery动态确定行和列的数量。下面是我的代码，它实际上添加了行和列，但不是根据用户的输入

function makeGrid() {
let numOfRow = 0; let numOfCol = 0;

$('#submit').on('click', function() {

    numOfRow = $('#height').val();
    numOfCol = $('#width').val();

    for (var i = 1; i <= numOfRow; i++) {
        let row = $('.grid-canvas').append('<tr>');
        for (col = 1; col <= numOfCol; col++) {
            $('tr').append('<td></td>');
        }
    }
}); 
}

makeGrid();

函数makeGrid（）{
设numOfRow=0；设numOfCol=0；
$（“#提交”）。在（'单击'，函数（）上{
numorrow=$（'#height'）.val（）；
numocol=$（'#width'）.val（）；
对于（var i=1；i您似乎没有使用
行
变量。我建议将新创建的
td
附加到
行
而不是
$（'tr'）
您似乎没有使用
行
变量。我建议将新创建的
td
附加到
行
而不是
$（'tr'）
纯javascript代码在这里


函数f（x，y）{
变量行=x，
rowButtonNumber=y；
var table=document.getElementById（“myTable”）；
table.innerHTML=“”；
对于（变量i=0；i

运输署{
宽度：200px；
高度：200px；
}
钮扣{
宽度：100%；
身高：100%；
}
排

纵队
去
纯javascript代码在这里


函数f（x，y）{
变量行=x，
rowButtonNumber=y；
var table=document.getElementById（“myTable”）；
table.innerHTML=“”；
对于（变量i=0；i


运输署{
宽度：200px；
高度：200px；
}
钮扣{
宽度：100%；
身高：100%；
}
排

纵队
去
尝试从以下位置更改代码：

$('#submit').on('click', function() {

numOfRow = $('#height').val();
numOfCol = $('#width').val();

for (var i = 1; i <= numOfRow; i++) {
    let row = $('.grid-canvas').append('<tr>');
    for (col = 1; col <= numOfCol; col++) {
        $('tr').append('<td></td>');
    }
}
}); 

$（'#提交'）。在（'click'，function（）上{
numorrow=$（'#height'）.val（）；
numocol=$（'#width'）.val（）；
对于（var i=1；i请尝试从以下位置更改代码：

$('#submit').on('click', function() {

numOfRow = $('#height').val();
numOfCol = $('#width').val();

for (var i = 1; i <= numOfRow; i++) {
    let row = $('.grid-canvas').append('<tr>');
    for (col = 1; col <= numOfCol; col++) {
        $('tr').append('<td></td>');
    }
}
}); 

$（'#提交'）。在（'click'，function（）上{
numorrow=$（'#height'）.val（）；
numocol=$（'#width'）.val（）；
对于（var i=1；我将
追加到行将不会创建
，因此不会创建表结构。您怎么说我没有使用行变量？我的意思是使用
row.append（…）
而不是
$（'tr'））.append
-正如Viksool在上文中回答的那样。将
追加到行中不会创建
，因此不会创建表结构。您怎么说我没有使用row变量？我的意思是使用
row.append（..）
而不是
$（'tr'）。append
-正如Viksool在上文中回答的一样。
$('#submit').on('click', function() {

numOfRow = $('#height').val();
numOfCol = $('#width').val();

for (var i = 1; i <= numOfRow; i++) {
    let row = $('.grid-canvas').append('<tr>');
    for (col = 1; col <= numOfCol; col++) {
        $('tr').append('<td></td>');
    }
}
}); 

$('#submit').on('click', function() {

numOfRow = $('#height').val();
numOfCol = $('#width').val();
var body = $('.grid-canvas');
for (var i = 1; i <= numOfRow; i++) {
  let row = $('<tr></tr>');
  for (col = 1; col <= numOfCol; col++) {
    row.append('<td></td>');
  }
  body.append(row);
}
});