Question

我试图使用Jquery用元素＃house1来切换div的类，但无论我做什么，它似乎都不想在我点击它时隐藏它自己。

这是与脚本相关的html代码：

    <!DOCTYPE html>
    <html>
    <head>
        <link href='http://fonts.googleapis.com/css?family=Cuprum' rel='stylesheet' type='text/css'>
        <link href="bas.css" type="text/css" rel="stylesheet"/>
        <meta charset="utf-8"/>
        <title>Jans Fastigheter</title>
    </head>
    <body>
    <div class="header">
        <div>
            <img src="jans_logo.jpg">
        </div>
        <ul>
            <li><a class="current_huvud" href="Huvudsida.html">Huvudsida</a></li>
            <li><a href="kontakta oss.html">Kontakta Oss</a></li>
        </ul>
    </div>
    <div>
        <div id="house1">
        </div>
        <div id="house2">
        </div>
        <div id="house3">
        </div>
    </div>

    <script>
    $(document).ready(function() {
        $("#house1").click(function() {
            $(this).toggleclass("hide");
        });
    });
    </script>
    </body>
    </html>

相关的css代码：

    #house1 {
width:250px;
height:250px;
margin: 30px 30%;
background-image: url("apartment_building.jpg");
background-size: cover;
    }
    .hide {
display: none;
    }

Answer 1

将$(this).toggleclass("hide");更改为$(this).toggleClass("hide");

将Jquery包含在您的代码中

<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script>

Answer 2

这应该是：

$(this).toggleClass("hide");

代替：

$(this).toggleclass("hide");

C 是toggleClass()

的首都

还要确保页面上包含Jquery，我不会在页面上看到。

在页面中添加以下行：

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

Answer 3

jsfiddle

    <div>
        <div class="house"  >
            aaaaa
        </div>
        <div class="house"  >
            bbbb
        </div>
        <div class="house">
            cccc
        </div>
    </div>

  $(document).ready(function() {  
     $(".house").click(function() {
           $(this).toggleClass("hide");
    });
  });

为什么jquery没有切换这个div的类？

3 个答案: