表格中的删除按钮，jQuery

Question

我使用JS和jQuery编写了代码。 代码将新行添加到表中。 每行都包含删除按钮，但它不起作用。 我要实现还编辑按钮。

我的桌子：

<div class="row">
   <div class="col-md-12">
      <table class="table table-striped" id = "my-table">
       <thead>
        <tr>
            <th>Date</th>
            <th>Example</th>

        </tr>
          </thead>
          <tbody>



          </tbody>

        </table>

   </div>
   </div>
  </div>

JS代码：

$(document).ready(function(){
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var yyyy = today.getFullYear();
if(dd<10) {
dd='0'+dd
} 

if(mm<10) {
mm='0'+mm
} 
today = mm+'/'+dd+'/'+yyyy;
//var counter = 1;


$('button#sending_button').click(function(){
    var text = $('textarea#mytextarea').val();
    $('#my-table').append('<tr><td>'+today+'</td><td>'+text+'</td><td><button type="button" id="delete-button"  class="btn btn-danger">Usuń</button></td></tr>');
    $('textarea#mytextarea').val('');
    //counter++;

});

$('#my-table').on('click', 'button.btn btn-danger', function() {
    $(this).parents('tr').remove();  

});

}）;

我不知道该问题我还需要解释什么。

Answer 1

您的问题在这里：

$('#my-table').on('click', 'button.btn btn-danger', function() {

它应该是button.btn.btn-danger 。

一些随机的建议：

• 不要重复每个按钮的ID（“ delete-button ”）：ID应该是唯一的
• 请改用语义上有意义的类（ delete button也可以）
• 定义委托事件侦听器时，请使用上述类，而不要使用button.btn.btn-danger （它太与DOM及其样式定义绑定了）
• 使用parent而不是parents来避免意外。 它们是目标不同的两种不同方法
• 事件效果更好，请使用closest 。