jQuery点击功能没有做我想要的

时间:2017-09-07 12:37:21

标签: jquery ajax

我有一张由DataTables组成的表。

我写了这个函数:

$(document).ready(function() {
  $('#tabletest tbody td').click( function () {
    var aPos = oTable.fnGetPosition( this );
    oTable.fnDeleteRow(aPos[0],null,true);
  });

  var oTable = $('#tabletest').dataTable({
    "bPaginate": true,
    "sPaginationType": "full_numbers",
    "bAutoWidth": false,
    "bLengthChange": false, 
    "bFilter": true
  });
});

这样就可以删除DataTable中的一行。有用。

使用tbody调用时,只需单击行中的任意位置即可删除行。 我想要的是,它只有在我点击我已经制作的删除按钮(带有ID)时才有效。

你们有解决方案吗?

我制作了JS代码:

$(document).ready(function() {
$('#tabletest tbody td .delete').click( function () {
var aPos = oTable.fnGetPosition( $(this).parent() );
oTable.fnDeleteRow(aPos[0],null,true);
});

var oTable = $('#tabletest').dataTable( {
"bPaginate": true,"sPaginationType": "full_numbers","bAutoWidth":    
false,"bLengthChange": false, "bFilter": true   } );
} );

DataTables表中的HTML按钮:

     <tr>
        <td>{{ record.EventDate |date('d-m-Y') }}</td>
        <td>{{ record.EventName }}</td>
        <td><a href="editevent/{{ record.Id }}"><img src="http://findicons.com/files/icons/560/fast_icon_users/128/edit_user.png" class="edit"></a></td>
        <td><a href="publishevent/{{ record.Id }}"><img src="../assets/img/published.jpg" class="edit"></a></td>
        <td><img src="http://findicons.com/files/icons/1262/amora/256/delete.png" class="edit" button class='delete'></td>
      </tr>

虽然它没有用。它不再删除任何东西。

2 个答案:

答案 0 :(得分:0)

只需为按钮指定一个类,例如<button class='delBtn'>Delete</button>

并将您的点击事件更改为:

$('#tabletest tbody td .delBtn').click( function () {
  var aPos = oTable.fnGetPosition( $(this).parent() );
  oTable.fnDeleteRow(aPos[0],null,true);
});

答案 1 :(得分:0)

 $("#tabletest").on("click", ".delete", function () {
    $(this).closest("tr").remove();    
   return false;
  });