2

<div>隠された別の中にあるを隠そうとして<div>います。私は animation: を使用していますが、外側が隠されて$("#innerDiv").hide(400)いる限り、内側は非表示にならず、後で外側を再表示すると表示されます。外側が表示されている場合、内側は予想どおりアニメーションで非表示になります。<div><div><div><div><div>

意味がないので、外側が隠されている<div>ときに内側がアニメーションで非表示になるとは思いません。<div>ただし<div>、少なくとも非表示になると予想されますが、そうではありません。

JavaScriptを変更し$("#innerDiv").hide()て問題を解決することがわかりましたが、外側が表示されているときに表示したいアニメーションが削除され<div>ます。

これは、問題を示す jsFiddle です。最初に「表示」ボタンをクリックしてから「非表示」ボタンをクリックすると、期待どおりにテキストがアニメーションで消えます。ただし、最初に [非表示] ボタンをクリックしてから [表示] ボタンをクリックすると、テキストは引き続き表示されます。非表示になることを期待しています（.hide()関数を使用したため）。

なぜこれが起こっているのですか?外側が表示されているときにアニメーションを保持する方法はありますが、外側<div>が.hide(400)非表示のときに要素を実際に非表示にする方法はあり<div>ますか?

4

2 に答える 2

1

親が非表示になっているかどうかに応じて、アニメーションを切り替えるスニペットを作成できます。

var innerDiv = $("#innerDiv");
if(innerDiv .parents("div").is(":visible")){
    innerDiv.hide(400);
}else{
    innerDiv.hide();
}

編集：親（...）セレクターをさらに説明する

任意のセレクターで.parents（ "..."）呼び出しを使用することもできます。したがって、ネストされたdivが直接の子よりも適切である場合でも、チェックしたいターゲットの親を見つけるためにバブルアップします。したがって、親divの名前がid = "outerDiv"の場合、次のように実行できます。

$("#innerDiv").parents("#outerDiv").is(":visible")

編集：より一般的な回避策

また、任意の要素に対してこれを実行して、非表示にするかどうかを決定することもできます（アニメーション用に独自のカスタムプラグインを作成することも、単に非表示にすることもできますが、それはあなたに任せます）

$(function(){
     HideOrAnimate($("#whatever"),400);
});

function HideOrAnimate(target, hideTime)
{
     if(target.parents(":hidden").length > 0){
          target.hide();
     }else{
          target.hide(hideTime);
     }
}
于 2012-07-24T19:00:58.360 に答える
1

コールバック オプションを使用して、内側の div cssdisplayプロパティを手動で変更できます。

display : none

ドキュメントを隠す

于 2012-07-24T17:46:31.313 に答える