Question

当我点击del按钮时，我得到的输出是

 mvn deploy

这是当前的输出

$(document).on("click", ".deletevideo", function(event)
{
     var video_id = $(this).data('videoid');
    var html = $('#videosexistingtable tr[video-id="' + video_id + '"]').prop('outerHTML');
    console.log(html);
        event.stopImmediatePropagation();
        event.preventDefault();
        return false;
});

是否可以完全删除此td

<tr class="existingvideos" video-id="110">
   <td>TCS</td>
   <td>Chandra</td>
   <td>
      <span class="btn btn-sm btn-success btn-circle">IT</span> 
   </td>
   <td>
      <i class="fa fa-check">Banking</i>
   </td>
   <td><a data-videoid="110" class="fa fa-trash remove-delete-icon deletevideo ui-link" title="Delete">Del</a></td>
</tr>

http://jsfiddle.net/cod7ceho/351/

Answer 1

你想删除整行吗？（tr）然后试试这个：

$(document).on("click", ".deletevideo", function(event){
	 $(this).closest("tr").remove();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="mytable2 table table-bordered table-hover" id="videosexistingtable">
   <tbody class="connectedSortable ui-sortable">
      <tr class="existingvideos">
         <th>Comp Name</th>
         <th>CEO</th>
         <th>Industry</th>
         <th>Domains</th>
         <th>Action</th>
      </tr>
      <tr class="existingvideos" video-id="110">
         <td>TCS</td>
         <td>Chandra</td>
         <td>
            <span class="btn btn-sm btn-success btn-circle">IT</span> 
         </td>
         <td>
            <i class="fa fa-check">Banking</i>
         </td>
         <td><a data-videoid="110" class="fa fa-trash remove-delete-icon deletevideo" title="Delete">Del</a></td>
      </tr>
   </tbody>
</table>

如果您只想删除td-cell，可以将最近的（“tr”）更改为最近的（“td”）

Answer 2

将$(this).remove();置于点击事件中，以从td删除链接中删除链接。

请查看以下工作片段。

$(document).on("click", ".deletevideo", function(event){
  var video_id = $(this).data('videoid');
  var html = $('#videosexistingtable tr[video-id="' + video_id + '"]').prop('outerHTML');
  console.log(html);
  $(this).remove();
  event.stopImmediatePropagation();
  event.preventDefault();
  return false;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="mytable2 table table-bordered table-hover" id="videosexistingtable">
  <tbody class="connectedSortable ui-sortable">
    <tr class="existingvideos">
      <th>Comp Name</th>
      <th>CEO</th>
      <th>Industry</th>
      <th>Domains</th>
      <th>Action</th>
    </tr>
    <tr class="existingvideos" video-id="110">
      <td>TCS</td>
      <td>Chandra</td>
      <td>
        <span class="btn btn-sm btn-success btn-circle">IT</span> 
      </td>
      <td>
        <i class="fa fa-check">Banking</i>
      </td>
      <td><a data-videoid="110" class="fa fa-trash remove-delete-icon deletevideo" title="Delete">Del</a></td>
    </tr>
  </tbody>
</table>

Answer 3

这是updates。请参阅课程.deleteThis。

http://jsfiddle.net/cod7ceho/353/

如何通过单击按钮从tr中删除td

3 个答案: