0

別の div が表示されているときに div を非表示にしようとしています。

div 1 と div 2 があります。

div 2 が表示されている場合は div 1 を非表示にし、div 2 が表示されていない場合は div 1 を表示/再表示する必要があります。

関数は、ページの読み込み時に関数/ドキュメントの準備ができている必要があります。

私はこれを試しましたが、運がありません。誰かがこれを行う方法を教えてください。

<script>
    window.onLoad(function () {
        if ($('.div2').is(":visible")) {
             $(".div1").fadeOut(fast);

        } else if ($('.div2').is(":hidden")) {
            $('.div1').fadeIn(fast);

        }
    });
</script>
4

4 に答える 4

3

のクラスを各 div に追加し、hiddenjQuery を使用してそのクラスを切り替えます。ちなみに、window.onloadは関数ではなく、 のような文字列を想定していますwindow.onload = function() {}。また、fast引用符を付けます。それが必要かどうかはわかりませんが、それがjQueryがそうするように言っている方法です。

<div class="div1"></div>
<div class="div2 hidden"></div>

.hidden { display: none }

$(document).ready(function() {

    if($(".div1").hasClass("hidden")) {
        $(".div2").fadeIn("fast");
    }

    else if($(".div2").hasClass("hidden")) {
        $(".div1").fadeIn("fast");
    }

});
于 2013-02-04T02:19:34.473 に答える
0

.fadeIn()およびメソッドに文字列を渡す必要があり.fadeOut()ます。

代わりに.fadeIn(fast)なります.fadeIn("fast")。についても同じです.fadeOut()。

そして一般的には、すでにjQueryを使用しているので、次のようにコードをラップすることをお勧めします。

$(function () {
    // Code goes here
});
于 2013-02-04T02:22:10.337 に答える
0

setTimeoutまたはsetIntervalを使用して、これらのdivが存在するかどうかを追跡できます

$(function() {
  var interval = window.setInterval(function() {
    if($('#div2').hasClass('showing')) {
      $('#div1').fadeOut('fast');
    }      
    if($('#div2').hasClass('hidden')) {
      $('#div1').fadeIn('fast');
    }
  }, 100);

  // when some time u don't want to track it
  // window.clearInterval(interval)
})

パフォーマンスを向上させる

var div1 = $('#div1')
  , div2 = $('#div2')


var interval ....
// same as pre code
于 2013-02-04T02:22:37.203 に答える
0

jqueryセレクター（javascriptライブラリ）を使用しているようです。jqueryを使用する場合は、ライブラリをドキュメントヘッダーに含めて、ライブラリが正しく読み込まれていることを確認してください（googleは、ライブラリをホストすることでこれを簡単にします
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>） 。

jQueryをロードすると、次のように実行できます

$(document).ready(function(){
if ($('.div1').is(":visible")) {
$('div2').hide();
}

else if ($('.div2').is(":visible")) {
$('div1').hide();
}

});

実例：http ：//jsfiddle.net/HVDHC/-display：noneをdiv2からdiv1に変更し、[実行]をクリックして交互に表示します。

于 2013-02-04T02:26:08.607 に答える