使用jquery刪除連接所在的行

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jquery 刪除連接所在行</title>
<style type="text/css">
table {
    border-collapse: collapse;
}
td {
    border: solid 1px red;
    width: 100px;
    height: 28px;
    text-align: center;
    vertical-align: middle;
}
</style>
<script src="jquery-3.2.1.min.js"></script>
<script>
$(function(){
    //爲刪除連接註冊事件
    $("a[title='刪除']").click(function(){
        $(this).parents('tr:first').remove();;
    });
});
</script>
</head>

<body>
<table width="200">
  <tr>
    <td>1</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><a href="#" title="刪除">刪除</a></td>
  </tr>
  <tr>
    <td>2</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><a href="#" title="刪除">刪除</a></td>
  </tr>
  <tr>
    <td>3</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><a href="#" title="刪除">刪除</a></td>
  </tr>
  <tr>
    <td>4</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><a href="#" title="刪除">刪除</a></td>
  </tr>
  <tr>
    <td>5</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><a href="#" title="刪除">刪除</a></td>
  </tr>
</table>
</body>
</html>
相關文章
相關標籤/搜索