下一個出現的東西，在DOM樹下

Question

我最困難的時候試圖引用下一個包含特定字符串的ID的元素。

基本上，我有一個鏈接，我需要show() NEXT div充當編輯的容器。

<div> 
<a href="#" id="link-1">Link</a> // go from here 
</div> 

<div id="form-container-1" class="hidden"> // to here 
<form> 
... 
</form> 

必須注意的：我不只是針對一個id ...的形式容器id中的「1」的宗旨，是因爲有好幾個。我正在使用「包含」選擇器id*="form-container"

Answer 1

的所有元素：

$('a').click(function() { 
    formId = $(this).attr('id').split('-')[1]; 
    $('#form-container-'+formId).show(); 
}); 

或者，如果您想在每個鏈接之後找到下一個表單：

$('a').click(function() { 
    $(this).next('form').show(); 
}); 

這兩種情況下，建議在鏈接中添加一個唯一的類，以顯示錶單並更新選擇器。

Answer 2

如果它直接進行當前項目，那麼將工作。

然後嘗試使用parent()和next()的組合。這樣您就可以參考包含div，然後找到下一個div。

工作例如：http://jsfiddle.net/PdatP/

的jQuery：

$('a').click(function(){ 
    $(this).parent().next().show(); 
}); 

Answer 3

這將讓下一個兄弟和顯示元件

$('#link-1').next().show(); 

如果不完全的下一個元素，你可以使用siblings方法喜歡;

$('#link-1').siblings('#form-container-1').show(); 

或者，如果你想顯示如果要動態地找到正確的形式展現根據id事遂所願包含form-container在它們的ID

Answer 4

$("#link-1").parent().next().show();