0

Webページに2つのdivがあり、スクリプトブロックのifステートメントでdivを表示するタイミングが指定されるまで、ページの読み込みから非表示にする必要があります。これは可能で、どのように実行できますか？jQueryがリンクされていますが、試したものが機能しません

<!DOCTYPE html>
<html>
<head>
    <style type="text/css">
        body {
            background-color: #3da9cd;
            background:url('background.jpg');
            height: 50%;
            width: 50%;
            margin:0;
            padding: 0;
            overflow:auto;
        }
        h1 {
            font-size: 34px;
            margin: 0;
            padding: 0;
            font-family: Georgia, "Times New Roman", Times, serif;
            font-weight: bold;
            color: #000000;
        .hidden { display: none; }
        .shown {display:block;}
}
</style>
<script type="text/javascript">


function WinLose()
{
    $("#win").hide();
$("#lose").hide();
    var x=document.getElementById("demo");
    x=x.innerHTML=Math.floor((Math.random()*5)+1);

    if (x==5)
    {
        $('#win').show()

    }
    else 
    {
        $('#lose').show()
    }

}

</script>

</head>
<body>


<p id="demo"></p>

<button onclick="WinLose()">Try it</button>

<!-- Win element -->
        <div id="win" class="hidden">Congratulations! You have won a prize. *UNIQUE CODE* Collect your prize from the Customer Services desk</div>

        <!-- The losing image div -->
        <div id="lose" class="hidden">Sorry, you have not won. Better luck next time</div>

</body>
</html>
4

3 に答える 3

2

CSS：

.DIV_CLASS{
    display:none;
}

JQuery：

$(document).ready(function(){
    if(some statment){
        $('.DIV_CLASS').show();
    }
});
于 2012-11-29T23:19:18.580 に答える
1

display次のようにcssプロパティを使用してdivの可視性を設定する必要があります。

.hidden { display: none; }

そしてあなたのdivはそのように：

<div class="hidden">first div</div>
<div class="hidden">second div</div>

hidden次に、あなたのjsを使用して、クラスまたはを削除します$.show()。

于 2012-11-29T23:20:28.087 に答える
0

ifステートメントにdivを表示するか、またはを使用して、 ifステートメントが設定されているかどうsetInterval()かsetTimeout()を定期的にチェックします。

于 2012-11-29T23:19:49.677 に答える