我的代碼有什么問題，嘗試獲取第一個元素文本jquery？

Question

看我的代碼，我想使它像這樣，當用戶單擊表tr時，我將獲得第一個td文本，因此jquery我先使用first（）然后使用text（），但它會回顯出td 1和td蘋果。 我只想獲取第一個td文本，我做錯了什么？ 欣賞。

 var gridtable = $('.gridtable'); gridtable.click(function(){ var name = $(this).first().text(); alert('name'); }) 

  <tr class="gridtable"> <td>1</td> <td >apple</td> </tr> <tr class="gridtable"> <td>2</td> <td >banana</td> </tr> 

Answer 1

在處理程序內部， this是指單擊的tr應用first()方法將檢索相同的tr本身。 相反，您需要過濾掉嵌套的td元素。 您可以使用:first偽類選擇器獲取第一個元素。

var gridtable = $('.gridtable:first');
gridtable.click(function(){
    // get the first element within the context
    var name = $('td:first', this).text();
    alert(name);
});

---

 var gridtable = $('.gridtable'); gridtable.click(function() { var name = $('td:first',this).text(); alert(name); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr class="gridtable"> <td>1</td> <td>apple</td> </tr> <tr class="gridtable"> <td>2</td> <td>banana</td> </tr> </table> 

Answer 2

var gridtable = $('.gridtable');

gridtable.click(function(){
        var name = $(this).find('td:first').text();
        alert(name);
  });

Answer 3

由於要在tr級別附加點擊處理程序，因此需要使用find函數選擇tr內的所有tds，然后選擇第一個td：

var name = $(this).find('td').first().text();

Answer 4

var gridtable指的是您的tr元素，因此當提高$element.click時， gridtable.first()將使用類.gridtable定位第一個元素。

您可以使用.gridtable.children()獲取gridtable的子級，然后使用gridtable .first()

請看以下示例： https : //jsfiddle.net/gnc9t1p2/1/

編輯1-

正如@JaromandaX所說，您應該使用var name = $(this)...來獲得被點擊的行。

Answer 5

我認為下面的代碼將對您有所幫助，它對我有用。

 var gridtable = $('.gridtable');
       gridtable.click(function(){
       var name = $(this).find("td:first").text();// for only first td
                              or 
       var name =   $(this).find("td:eq(0)").text();// you can change index number like  eq(0) ,eq(1) for nect td
                alert(name);
      })