javascript - 如何撤消添加的行而不删除表标题

标签 javascript jquery

现在,我有一个重置按钮来重置所有已添加的行。问题是它还删除了我想保留的表格标题。 有什么想法可以保持表格标题吗?谢谢大家。

$('#add-row').click(function() {
  var $tbody, $row, additionalRows;
  var numNewRows = parseInt($('#insert-rows-amnt').val(), 10);

  if (isNaN(numNewRows) || numNewRows <= 0) {
    alert('Please enter number of injection');
  } else {

    $tbody = $('table#one tbody ');
    $row = $tbody.find('tr:last');
    var lastRowIndex = ($row.index() == -1 ? 0 : $row.index()) + 1;
    additionalRows = new Array(numNewRows);
    for (i = 0; i < numNewRows; i++) {
      additionalRows[i] = ` <tr>
    <td>${lastRowIndex}</td>
      <td>
      <input type="text" style="width: 100px" name="vaccineid[]"></td>
      <td><input type="text" style="width:160px"name="vaccinename1[]">   				</td>
  	  </tr>`
      lastRowIndex = lastRowIndex + 1;
    }

    $tbody.append(additionalRows.join());
  }
});

$('[name="reset"]').click(function() {
  $('#one tr').remove();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="number" id="insert-rows-amnt" name="insert-rows-amnt" value="<?php echo $tam ?>" />
<button id="add-row" type="button">Add Row</button>
<button type="reset" name="reset">Reset Row</button>

<table id="one">
  <thead>
    <th>No.</th>
    <th>Name</th>
    <th>Gender</th>
  </thead>
  <tbody>
  </tbody>
</table>

最佳答案

只需选择<TBODY>

$('#one tbody tr').remove();

关于javascript - 如何撤消添加的行而不删除表标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45138937/

相关文章:

javascript - 改变 Vimeo 播放器的颜色?

javascript - 使用 CSS transform 属性使元素响应

javascript - 文件上传点击模拟按钮触发表单

javascript - 处理从 AJAX 调用返回的数据

php - 为什么 jQuery 在我的网站上不起作用?

javascript - 如何从sql中获取nodejs的数据并返回json?

Javascript - 如何显示错误,例如访问不存在的键对象而不是未定义?

javascript - 默认 momentjs 为 dd-mm-yyyy 格式

javascript - 为什么 jQuery .animate 回调发生在动画之前?

javascript - YUI 压缩器错误 - jQuery Autotype