テーブルのhrefでどの行番号がクリックされたかを知る方法は？

Question

私は、次のようなテーブルを持っている：

<table> 
    <tr> 
     <td>1</td><td>1</td><td><a href="1" id='1' class'alert'>1</a></td> 
    </tr> 
    <tr> 
     <td>2</td><td>2</td><td><a href="2" id='2' class'alert'>2</a></td> 
    </tr> 
    <tr> 
     <td>3</td><td>3</td><td><a href="3" id='3' class'alert'>3</a></td> 
    </tr> 
</table> 

ユーザーが<a>をクリックすると、どのように私は、この行のインデックス（TR要素）を得ることができますか？

たとえば、最初の<a>をクリックすると、それを取り上げて<td>1</td><td>1</td><td><a href="1" id='1' class'alert'>1</a></td>を返します。

Answer 1

あなたはtdで番号を取得したい場合は、prev()

$('table a').click(function(e) { 
 
    e.preventDefault(); // prevent default click action 
 
    alert($(this) 
 
    .parent() // get parent td 
 
    .prev('td') // get previous sibling 
 
    .text() // get text 
 
); 
 
    // or get first column by 
 
    // $(this).closest('tr').children('td').eq(0).text() 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>1</td> 
 
    <td>1</td> 
 
    <td><a href="1" id='1' class 'alert'>1</a> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td>2</td> 
 
    <td>2</td> 
 
    <td><a href="2" id='2' class 'alert'>2</a> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td>3</td> 
 
    <td>3</td> 
 
    <td><a href="3" id='3' class 'alert'>3</a> 
 
    </td> 
 
    </tr> 
 
</table>

012を使用 index()

$('table a').click(function(e) { 
 
    e.preventDefault(); // prevent default click action 
 
    alert($(this) 
 
    .closest('tr') // get the tr 
 
    .index() + 1 // get index based on siblings , add 1 since index start from 0 
 
); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>1</td> 
 
    <td>1</td> 
 
    <td><a href="1" id='1' class 'alert'>1</a> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td>2</td> 
 
    <td>2</td> 
 
    <td><a href="2" id='2' class 'alert'>2</a> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td>3</td> 
 
    <td>3</td> 
 
    <td><a href="3" id='3' class 'alert'>3</a> 
 
    </td> 
 
    </tr> 
 
</table>

---

を使用してインデックスを取得することができます