Javascript 如何添加自动编号表行？

在我的例子中，我的HTML和javascript：

$（'.addRow'）。在（'click'，function（）上{
addRow（）；
});
函数addRow（）{
var tr=''+
'' +
'';
$（'tbody'）。追加（tr）；
};

不
试试这个：

var i = 1;

function addRow() {
  var tr = '<tr>' +
    '<td>' + i + '.</td>' +
    '</tr>';
  $('tbody').append(tr);
  i++;
};

var i=1；
函数addRow（）{
var tr=''+
“+i+”+
'';
$（'tbody'）。追加（tr）；
i++；
};
在函数外部定义一个变量（
i
，在下面的示例中），然后在每次追加后增加变量


var i=1；
$（'.addRow'）。在（'click'，function（）上{
addRow（）；
});
函数addRow（）{
var tr=''+
“+i+”+
'';
$（'tbody'）。追加（tr）；
i++；
};

不
以下是一个工作示例：

您需要一个全局变量来跟踪当前所在的行：

var row = 1;
function addRow() {
  var tr='<tr>'+
         '<td>'+ (row) + '. </td>'+
         '</tr>';
  row++;
  $('tbody').append(tr);
}

$('.addRow').on('click', function() {
    addRow();
});

var行=1；
函数addRow（）{
var tr=''+
“+（行）+.”+
'';
行++；
$（'tbody'）。追加（tr）；
}
$（'.addRow'）。在（'click'，function（）上{
addRow（）；
});
您的代码有两个问题。首先，您实际上没有一个
元素，因此没有任何附加内容。其次，您需要使用一个循环来增加要显示的数字

以下是一个工作示例：


$（'.addRow'）。在（'click'，function（）上{
addRow（）；
});
var i=1；
函数addRow（）{
var tr=''+
“+i+”+
'';
$（'tbody'）。追加（tr）；
i++；
};

不
您可以为此使用css计数器

检查以下代码段


$（'.addRow'）。在（'click'，function（）上{
addRow（）；
});
函数addRow（）{
var tr=''+
“你好”+
'';
$（'table tbody'）。追加（tr）；
};
t车身{
计数器复位：行；
/*将行计数器设置为0*/
}
tbody tr：：之前{
计数器增量：行；
/*增加行计数器*/
内容：计数器（行）“：”；
/*显示行*/
}

不
您的html，您需要添加tbody

<table id="example1" class="table table-bordered">
  <thead>
    <th>No.</th>
    <th style="text-align:center">
      <a href='#' class="addRow"><i class="glyphicon glyphicon-plus"></i></a>
    </th>
  </thead>
  <tbody>

  </tbody>
</table>


不

然后是您的脚本：

$('.addRow').on('click', function() {
  addRow();
});
//Define row number
var rowNum = 1;
function addRow() {
  var tr = '<tr>' + '<td>' + rowNum + '</td>' + '</tr>';
  $('tbody').append(tr);
  rowNum++;
};

$（'.addRow'）。在（'click'，function（）上{
addRow（）；
});
//定义行号
var-rowNum=1；
函数addRow（）{
var tr=''+''+rowNum+''；
$（'tbody'）。追加（tr）；
rowNum++；
};
如果答案有帮助，请考虑接受它