Question

我想在以下代码目录中添加插入按钮

如何在插入部分添加按钮。

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="list_add_rows">
  <p>
    <input type="text" name="icerik1" />
    <input type="text" name="icerik1" />
  </p>
</div>
<a id="row_add_btn">Add</a>

＆＃13;

AppComponent

＆＃13;

Answer 1

如果你想点击按钮来删除行，这个jQuery应该可以解决这个问题：

$(document).on("click", ".ibtnDel", function () {
    $(this).parent().remove();
});

jQuery on() documentation

Answer 2

如果您计划插入行的删除，那么您需要使用上面提到的Will P.代码，但此外您还需要以不同方式处理最大行数。

增加if条件中的数字，减去删除行。

示例代码段：

＆＃13;

$(document).ready(function() {
  $('#row_add_btn').click(AddRows);
  $(document).on('click', '.ibtnDel', removeRow);
  var number = 1;

  function AddRows() {
    if (number <= 21) {
      number++;
      var AddToRows = '<p><input name="icerik' + number + '"/> <input name="icerik' + number + '" /><input type="button" class="ibtnDel"></p>'

      $('#list_add_rows').append(AddToRows)
    }
  }

  function removeRow() {
    number--;
    $(this).parent().remove();
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="list_add_rows">
  <p>
    <input type="text" name="icerik1" />
    <input type="text" name="icerik1" />
  </p>
</div>
<a id="row_add_btn">Add</a>

＆＃13;

Jquery添加行删除按钮？

2 个答案: