仅查看了1个div的WebApp

时间:2012-07-24 14:54:24

标签: web-applications html

我正在尝试创建一个webapp并四处寻找教程...我发现“jquery”并注意到我看了代码,没有单个网站,只有一些div创建了单个网站......怎么做的?当我创建一个带有div的网站时,他们就在一个网站上。

由于

1 个答案:

答案 0 :(得分:0)

您要做的是确定网址中的哈希标记后面会显示哪些文字,并相应地显示/隐藏某些div。

您可以使用jQuery轻松完成此操作。下面是我写的一个非常粗略的例子,但应该让你知道我在说什么。

index.html #home 将显示“来自第1页的内容”

index.html#about 将显示“来自第2页的内容”

<!DOCTYPE HTML>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
</head>
<body>

    <div id="home_content_div" class="content_divs">
        Content from page 1
    </div>
    <div id="about_content_div" class="content_divs">
        Content from page 2
    </div>

    <script>
         var identifier = window.location.hash;

         $(".content_divs").hide();
         if (identifier === "#home") {
             $("#home_content_div").show();
         }
         else if (identifier === "#about") {
             $("#about_content_div").show();
         }
    </script>

</body>
</html>