2011-11-13 18 views
2

はおそらく最良の例で説明する:私はjQueryのツール「タブ」ツールを使用していJqueryを使用して非表示のタブに子要素を非表示にするにはどうすればいいですか?

<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> 

。これにより、上の2つのdivの表示が切り替わり、一度に1つしか表示されなくなります。次のように

問題がある:これは、タブ1を隠し

  1. タブ2のユーザスイッチ、およびフィールド3 1〜これはまた、フィールド4を介して、タブ2とその子を示します

  2. ユーザーはタブ2で現在の非表示のタブ1からフィールド2を削除する必要があるアクションを実行します。私はこのべき非表示フィールド2 $('#field-2').hide(0);

を使用しますが、フィールド2がすでに隠されているので、何もしませんよ。それは今は大丈夫です。

3.ユーザーがタブ1に戻ります。

実際の結果: フィールド2を含む3つのフィールドがすべて再び表示されるようになりました。

望ましい結果: フィールド1と3が表示されるようになりましたが、それが明示的に機能によって隠されていたので、タブ-1への切り替えは、いないいない非表示フィールド2を行います。フィールド2は明示的に表示されなくなるまで非表示のままでなければなりません。

display:none;というフィールドに特別なCSSクラスを割り当てることでこれを回避することができると思っていますが、割り当てられていないタブが表示されているかどうかはわかりません余分なCSSクラス。

答えて

1

あなたが実際に要素のdisplayスタイルを変更した場合、代わりにhideを使用しての、仕事に表示されます。

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

これは動作しますが、よろしくお願いします。 .hide()メソッドの奇妙なことは同じことですが... – Nick

+1

@Nick私が推測することは、要素が何かをする前に要素が表示されているかどうかを最初に調べる 'hide'です。そうでない場合(たとえば、その親が既に隠されている場合)、何もしません。もちろん。 – sdleihssirhc

関連する問題