得到表中的第三個單元格jQuery

我以爲我對此有一個體面的處理，但顯然不是。所以我們再來一次。我希望單擊單元格的兩個空格的值。這將是該行的第3列。這裏有一些代碼要理解。得到表中的第三個單元格jQuery

我創建這樣

PHP

$project_info = $db->prepare(" 
    SELECT projects.id, 
     projects.project_name,     
     projects.pm,  
     // ...more columns 
    FROM projects 
    WHERE account_id = ?       
"); 

$project_info->bindValue(1, $aid, PDO::PARAM_STR); 
$project_info->execute();  

echo "<table class='projects_contentTable'>"; 
echo "<th class='content_th'>" . "" . "</th>"; 
echo "<th class='content_th'>" . "" . "</th>"; 
echo "<th class='content_th'>" . "Job #" . "</th>"; 
// ...more headers 

while ($row = $project_info->fetch(PDO::FETCH_ASSOC)) {    
    echo "<tr>"; 
    echo "<td class='content_td'>" . "<img src='images/edit.png' class='edit_project_record'/>" . "</td>"; 
    echo "<td class='content_td'>" . "<img src='images/view.png' class='view_project_record'/>" . "</td>";    
    echo "<td class='content_td'>" . "<a href='#'>" . $row['id'] . "</a>" . "</td>"; 
    // ...more td's 
    echo "</tr>";    
} 
echo "</table>";

與此代碼表，從細胞

jQuery的

$('body').on('click', '.edit_project_record', function() { 
    pid = $(this).parent().find('td:eq(3)').text(); 
    alert(pid); 
    loadEditProject(); 
});

現在WH獲得的價值該警報觸發它在對話框內沒有任何內容。所以我沒有從正確的單元中獲取價值。我試圖從邏輯上解決這個問題，但我被卡住了。這是我的理解，這是顯然錯誤

$（這）=圖像，裏面 'TD' 元素。（'td：eq（3）'）=從父位置找到一個特定的'td'，在這種情況下，第三列的行。
的.text（）=所選單元格在我的邏輯被打破，所以我可以解決這個問題對我來說

請解釋的文本值。謝謝

來源

2013-08-03 i_me_mine

你只是想在第三列每次或小區2列以上，從那裏你點擊？仔細看下面的答案。他們中的大多數只是選擇第三列，無論點擊發生在哪裏。 – DevlshOne

@DevlshOne是的，我不想要任何第三列。我希望行中的第三列發生點擊。我也不希望：nth-child（x）值會返回列中的所有值。謝謝你指出這 –

有兩件事情：

:eq()是基於零的，所以你需要td:eq(2)。
$(this)是圖片，所以$(this).parent()是td。 find()搜索後代，並且在您選擇的td內沒有td。

因此，你需要這樣的：

$(this).closest('tr').find('td:eq(2)').text();

closest()開始在當前元素，直到找到選擇相匹配的元素貫穿了DOM。從母公司tr，您可以findtd s。

小提琴，用DIV而不是圖像：http://jsfiddle.net/bAz8P/

來源

2013-08-03 02:49:53

，謝謝Jason，這個工作就像一個魅力和解釋正是我需要的，所以我希望*不必再問這樣的問題了。 +1和接受的答案 –

很高興我能幫上忙。 –

要考慮到eq是從零開始，所以如果你想獲得第三列，你需要使用eq(2)

pid = $(this).closest('tr').find('td:eq(2)').text();

正如其他答案已經指出，家長不會放棄你的行爲this父母是td。你可以使用closest

來源

2013-08-03 02:45:46

yea，我看到傑森答案。這正是我需要的解釋，我需要的。非常感謝。 +1 –

你可以使用.closest()找到行，然後找到（基於eq 0）電池：

$('body').on('click', '.edit_project_record', function() { 
    pid = $(this).closest('tr').find('td:eq(2)').text(); 
    alert(pid); 
    loadEditProject(); 
});

來源

2013-08-03 02:49:01 ethorn10

謝謝你的幫助+1另一種正確的方法做到這一點 –

如果你真的希望小區2個單元的一個的右側，您「已經點擊...

$('.projects_contentTable').on('click', 'td img', function() { 
    var myTD = $('td').index(this); 
    var pid = $(this).closest('tr').find('td:eq(myTD + 2)').text(); 
    alert(pid); 
    loadEditProject(); 
});

來源

2013-08-03 02:49:29 DevlshOne

謝謝你，我很欣賞答案。 +1 –

所以我只是注意到你的評論最高。這是否意味着Jason的答案不會產生相同的結果？因爲它現在給了我想要的價值。與你的相同 –

Jason的回答很好，因爲他的腳本只有在單擊「edit_project_record」類時觸發，該類是單元格的第一列。所以，當它返回第3列時，它正在做正確的事情。我的答案可以用於任何單元格，因爲它不是由特定的類觸發的，而是由'td'中的'img'觸發的。因此，它可能是第16個單元格中的「img」，它將返回第18個單元格的文本。大聲笑..你跟着那個？ – DevlshOne

得到表中的第三個單元格jQuery

回答

相關問題