Question

当单击单元格内的按钮时，我试图获取所选行的rowindex ..这是我的代码。请帮我，我哪里出错了..谢谢

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <title>JS Bin</title>
  <script>
    $(document).on('click','.delrow',function() {   // Raising Click event for table row to mark as selected
                var cRow =  $(this).parent().parent();
                alert (cRow.rowIndex);
                $(this).parent().parent().remove(); //Deleting the Row (tr) Element
            });  
  </script>
</head>
<body>

    <table class ="table">
    <tr>
      <td> India </td> <td style="text-align: center"> <span style="color:red; text-align: center" class="glyphicon glyphicon-remove-circle delrow"> </span> </td>
    </tr>
    <tr>
      <td> Malaysia </td> <td style="text-align: center"> <span style="color:red; text-align: center" class="glyphicon glyphicon-remove-circle delrow"> </span> </td>
    </tr>
    <tr>  
    <td> Australia </td> <td style="text-align: center"> <span style="color:red; text-align: center" class="glyphicon glyphicon-remove-circle delrow"> </span> </td>
    </tr>
    <tr>
      <td> United States </td> <td style="text-align: center"> <span style="color:red; text-align: center" class="glyphicon glyphicon-remove-circle delrow"> </span> </td>
    </tr>   

    </table
</body>
</html>

Answer 1

只需转到$row = $(this).closest("tr")点击$(this)

.delrow的地方

要获得index，你可以使用

alert( $row.index() );
alert( $row[0].rowIndex );

示例：

$(document).on('click', '.delrow', function() {

  var $row = $(this).closest("tr"); // Get the .closest Row
  alert( $row.index() );
  $row.remove();                    // and delete it

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table">
  <tr>
    <td> India </td>
    <td style="text-align: center"> <span style="color:red; text-align: center" class="glyphicon glyphicon-remove-circle delrow">&times;</span> </td>
  </tr>
  <tr>
    <td> Malaysia </td>
    <td style="text-align: center"> <span style="color:red; text-align: center" class="glyphicon glyphicon-remove-circle delrow">&times;</span> </td>
  </tr>
  <tr>
    <td> Australia </td>
    <td style="text-align: center"> <span style="color:red; text-align: center" class="glyphicon glyphicon-remove-circle delrow">&times;</span> </td>
  </tr>
  <tr>
    <td> United States </td>
    <td style="text-align: center"> <span style="color:red; text-align: center" class="glyphicon glyphicon-remove-circle delrow">&times;</span> </td>
  </tr>

</table>

Answer 2

删除 td 的简单答案是

jQuery('table tr td').slice(0, 3).remove();

您必须将值传递给切片（从头开始，结束）。如果您要删除 tr ，请将其设为jQuery('table tr').slice(0, 3).remove();

取决于您的问题

获取所选行jquery的rowindex

2 个答案: