如何在動態點擊tr列中獲取tr的第二個td

Question

如何獲得第二個td文本值。當我單擊任何tr列時，必須顯示第二個td文本值

 td:hover{ background-color:red; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <table border="1px"> <thead> <tr> <th>row1</th><th>row2</th><th>row3</th><th>row4</th><th>row5</th> </tr> </thead> <tbody> <tr data-class="weeks"> <td class="cls">1</td><td class="cls">2</td><td>3</td><td>4</td><td>5</td> </tr> <tr data-class="weeks"> <td>6</td><td>7</td><td>8</td><td>9</td><td>10</td> </tr> </tbody> </table> 

Answer 1

 $('td').click(function(){//add click event on each td console.log($(this).closest('tr').find('td:nth-child(2)').text());//log the result of getting the second td text }) 

 td:hover{ background-color:red; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <table border="1px"> <thead> <tr> <th>row1</th><th>row2</th><th>row3</th><th>row4</th><th>row5</th> </tr> </thead> <tbody> <tr data-class="weeks"> <td class="cls">1</td><td class="cls">2</td><td>3</td><td>4</td><td>5</td> </tr> <tr data-class="weeks"> <td>6</td><td>7</td><td>8</td><td>9</td><td>10</td> </tr> </tbody> </table> 

$(this).closest('tr').find('td:nth-child(2)').text()

1. 使用.closest('tr')獲得所單擊td的行
2. 使用.find('td:nth-child(2)')獲得被點擊行的第二個td
3. 使用.text()獲取所單擊行的第二個td的文本