如何使用Jquery隱藏隱藏選項卡上的子元素，並隱藏它直至隱藏它？

Question

可能是最好的例子來說：

<div id="tab-1"> 
    <input name="1" type="text" /> 
    <input name="2" type="text" /> 
    <input name="3" type="text" /> 
<div> 
<div id="tab-2"> 
    <input name="4" type="text" /> 
    <input name="5" type="text" /> 
    <input name="6" type="text" /> 
<div> 

我使用jQuery工具「選項卡」工具。這將切換上面兩個div的可見性，以便一次只顯示一個div。

的問題是如下：

1. 在用戶切換到標籤2.這隱藏標籤-1和字段1至3 這也說明選項卡-2和其孩子，字段4到6.

2. 用戶在選項卡2上執行操作，該選項卡應從現在隱藏的選項卡1中刪除字段2。我使用$('#field-2').hide(0);

這應該隱藏字段中的兩個，但什麼都不做，因爲第二場已經隱藏。現在很好。

3.用戶切換回製表符-1。

實際結果： 所有三個字段，包括字段2，現在都可以再次看到。

期望的結果： 字段1和3，現在可見的，但切換到製表1中未確實取消隱藏字段2，因爲它是明確的函數隱藏。字段2應該保持隱藏狀態，直到顯式取消隱藏。

我想我可以通過爲display:none;指定一個特殊的css類來避開這個問題，但我想知道是否有更好的解決方案來獨立顯示/隱藏該元素所在的選項卡，而無需分配額外的CSS類。

Answer 1

看來，如果你確實改變元素的風格display，而不是使用hide工作：

$('selector').css('display', 'none');