JQuery on点击CSS不起作用

Question

我有JQuery代码来更改ID的CSS。如果我使用event hover，它运行良好。但是，当我将其更改为click event时，它不起作用，控制台日志中甚至没有任何内容显示。我已经在这里创造一个片段：

$(document).ready(function(){ 
 
\t $("#donatenow").click(function(){ 
 
\t console.log("klik klik"); 
 
\t \t $("#subdonate").show(); 
 
\t \t }, function(){ 
 
\t \t $("#subdonate").hide(); 
 
\t }); 
 
});

.subdonate{ 
 
\t float:left; 
 
\t margin-top:-45px; 
 
\t display:none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<img src="http://buymebook.com/assets/cat/School%20and%20College%20Text%20Books.jpg" style="margin:20px;" class="promo3" id="donatenow" /><br /> 
 
\t \t \t <div class="subdonate" id="subdonate"> 
 
\t \t \t \t <a href="#"><img src="http://p3cdn4static.sharpschool.com/UserFiles/Servers/Server_1110080/Image/books.jpg" style="margin:20px;" class="promo3" /></a><br /> 
 
\t \t \t \t <a href="#"><img src="http://p3cdn4static.sharpschool.com/UserFiles/Servers/Server_1110080/Image/books.jpg" style="margin:20px; margin-top:-25px;" class="promo3" /></a> 
 
\t \t \t </div>

有谁知道为什么我的jQuery的失败？我想要的是，当我点击第一张图片时，显示第二张和第三张图片，但是当我再次点击时，第二张和第三张图片会再次隐藏。

Answer 1

试试这个。

这里有一个例子：http://jsfiddle.net/aqm7kjbg/4/

只是改变你的jQuery。

var count = 1; 
$("#donatenow").click(function(){ 

    if(count % 2){ 
     $("#subdonate").show(); 
     count = count + 1; 
    }else{ 
     $("#subdonate").hide(); 
     count = 1; 
    } 

});