javascript - 如何使 .click 在 jquery 中执行两个功能？

Question

我是 jQuery 和 JaVascript 的超级新手，我喜欢它，但我遇到了问题，，，

我有一个名为 button1 的元素，我想让另一个名为 bubble1 的元素在单击一次时消失，并在再次单击时重新出现。

我试过了，但没有用

$(document).ready(function(){
    $('#button_1').click(function (){
        $('#bubble1').css('visibility','hidden');
        $('#button_1').click (function(){
            $('#bubble1'.css('visibility'.'visible');
        });
    });
});

这第二个有效，但对象消失并一键重新出现。

$(document).ready(function (){
    $('#button_1').click(function (){
        $('#bubble1').fadeOut();
    });
});
$('#button_1').click(function (){
    $('#bubble1').fadeIn();
});

Answer 1

你不应该重新绑定click事件，你可以使用toggle()or fadeToggle()：

$("#button_1").click(function() {
    $("#bubble1").fadeToggle();
});

演示：http: //jsfiddle.net/E9PRa/

Answer 2

您可以使用切换而不是单击。

现场演示

$('#button_1').click(function (){
   $('#bubble1').toggle();
});

您正在绑定单击两次，您可以设置条件并绑定两次将导致双重动作。

Answer 3

先前答案中的切换效果很好，并且是大多数人会做的。如果你想要一些明确的东西来做同样的事情，并允许你根据其他元素的状态做更多的事情：

$("#button_1").click(function() {
    if ($("#bubble1").is(':visible')) 
       $('#bubble1').fadeOut();
    else
       $('#bubble1').fadeIn();
});