jQuery - 查找下一個Div

我想在輸入按鈕後找到下一個div並切換它。jQuery - 查找下一個Div

我在做什麼錯？

JS：

$(".showNextExperience").click(function() { 
    $(".experience").show(); 
});

HTML：

<input class="showNextExperience" > 
<div class="experience">Experience 1</div> 

<input class="showNextExperience"> 
<div class="experience">Experience 2</div> 

<input class="showNextExperience"> 
<div class="experience">Experience 3</div> 

<input class="showNextExperience" > 
<div class="experience">Experience 4</div>

好吧，這是行不通---

$(".showExperience").click(function() { 
    $(this).next(".experience").toggle(); 
}); 

<table class="data"> 
    <tr class="tableHead"> 
     <td></td> 
     <td width="50" align="right"><input type="button" class="showExperience" value="show"></td> 
    </tr> 
</table> 
<div class="experience">2</div>

當我移動輸入按鈕就在上面的DIV它的工作原理正好。

$(".showExperience").click(function() { 
    $(this).next(".experience").toggle(); 
}); 

<input type="button" class="showExperience" value="show"> 
<div class="experience">2</div>

你能解釋一下嗎？

來源

2011-07-19 Evik James

作爲最後回答您的問題爲什麼您的表中的按鈕不起作用。因爲'next（'showExperience'）'搜索該類的下一個兄弟，但是你的按鈕有0個兄弟來搜索。我可以補充說，輸入標籤永遠不會關閉（髒編碼），上面是一個空的td（非常髒的編碼），請問整個表的重點是什麼，如果它真的只包含一個按鈕？ > _ < –

簡單：

$(".showNextExperience").click(function() { 
    $(this).next(".experience").toggle(); 
});

參見：

來源

2011-07-19 18:09:42 karim79

這是正確的答案，正是我一直在做的。但它不適合我。我的桌子有點不對勁。當輸入按鈕在表格外時，它工作正常。當我將同一個按鈕剪切/放入一張桌子時，它會停止工作。謝謝！ –

因爲'.next'只選擇*下一個兄弟*。在表元素的情況下，您可能需要遍歷父行，找到下一行，並在行內找到'.experience' div。 DOM結構很重要！例如'$（this）.closest（「tr」）。next（）。find（「。experience」）。toggle（）' – karim79

你是100％!!!雖然這是一個難看的解決方案。我的div在桌子後面。我必須去父母（）。父母（）。父母（）。下一個（「div.experience」）？或類似的東西？我也無法做到這一點。 –

試試這個

$(".showNextExperience").click(function() { 
    $(this).next("div.experience").toggle(); 
});

來源

2011-07-19 18:10:11 ShankarSangoli

$(this).siblingings().eq(0)應該這樣做。

來源

2011-07-19 18:10:43 Michael

......兄弟姐妹（）'？ –

是的。 ** INGS **瞭解一些jQuery你爲什麼不@RUJordan？ ;-D – qwertynl

是的，這就像你的兄弟姐妹一樣 – iConnor

$(".showNextExperience").click(function() { 
    $(this).next().show(); 
});

來源

2011-07-19 18:10:56 zachzurn

jQuery - 查找下一個Div

回答

相關問題