獲取兄弟姐妹內容jquery

Question

以下是我的代碼，我的目標是當用戶點擊<a>我想提醒cl​​ass ='sibling_3'的內容是'Hello'。

<td class="sibling_1"> 
    <a href="#">Click Me</a> 
</td> 
<td class="sibling_2"></td> 
<td class="sibling_3"> 
    <p class="par">Hello</p> 
</td> 

我試過做下面的代碼，但它給了我一個未定義的錯誤。

$('a').click(function(){ 
    alert($(this).closest('.par').html()); 
}); 

Answer 1

$('a').click(function() { 
    alert($(this).closest('td').siblings().find('.par').html()); 
}); 

說明：

$(this)   // Get the current link clicked 
.closest('td') // Go to the closest parent td 
.siblings()  // Get the siblings of td 
.find('.par') // find the element with .par class 
.html()   // Get its content 

Answer 2

你可以試試：

$('a').click(function(){ 
    alert($(this).parent().parent().find('.par').html()); 
}); 

Answer 3

$(this).parent().next().next().find('.par').html() 

Answer 4

試試這個：

$('a').click(function(){ 
    alert($(this).parents('table').find('.par').html()); 
}); 

Answer 5

如果你想提醒的內容是在一個類（或標識）定義的標記，你可以做簡單，如：

$('a').click(function(){ 
    alert($('.par').html()); 
}); 

如果不是，它是在最後的兄弟姐妹，定義與否，代碼將是

$('a').click(function(){ 
    alert($(this).parents().get(0).siblings(':last').text()); 
}); 

Answer 6

你可以用更短的一個嘗試：

$('a').click(function(){ 
    alert($(this).closest('tr').find('.par').html()); 
}); 

Find a Demo here

Answer 7

$('a').click(function(){ 
    alert($('.par').text()); // Simple way 
    alert($(this).parent().parent().find('.par').html()); // Find through parent 
}); 

Demo