0

我在网页上有两个 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;
}

查询：

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

您应该使用 cssdisplay属性设置 div 的可见性，如下所示：

.hidden { display: none; }

你的 div 像这样：

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

然后使用您的 js 删除hidden该类或$.show().

于 2012-11-29T23:20:28.087 回答
0

您要么在 if 语句中显示 div，要么使用setInterval()或setTimeout()定期检查 if 语句集。

于 2012-11-29T23:19:49.677 回答