jquery - 如何处理jquery中其他关闭按钮上的切换事件？

Question

我使用 jquery 创建了切换效果。我想用右上角的关闭按钮关闭一个弹出 div，而不影响当前的切换效果。

有关演示，请参阅链接。

$(document).ready(function(){
     $(".infoBtn").click(function(){
           $(".popUpDiv").toggle("fast");
           //$(this).toggleClass("active");
           return false;
     });
});

jsfiddle链接

Answer 1

利用： $(".infoBtn, .closePopsUp").click(function(){

Answer 2

在点击事件上使用多个选择器

    $(".infoBtn,.closePopsUp").click(function(){
    $(".popUpDiv").toggle("fast");

    return false;
});

在这里摆弄

Answer 3

您的选择器字符串中可以有多个选择器：

$(document).ready(function(){
     $(".infoBtn, .closePopsUp").click(function(){
           $(".popUpDiv").toggle("fast", function(){
               //animation complete
               $(this).toggleClass("active");
           });
           return false;
     });
});

我还添加了在动画完成后切换类的功能。这是一个很好的做法，因为它确保应用于此类的任何 CSS 规则都不会影响动画。

来源

http://api.jquery.com/toggle/

http://api.jquery.com/category/selectors/

Answer 4

如果可以在点击事件中做同样的事情#closePopsPan

$(document).ready(function(){

                $(".infoBtn").click(function(){
                    $(".popUpDiv").toggle("fast");
                    //$(this).toggleClass("active");
                    return false;
                });

    $("#closePopsPan").on("click",function(){
        $(".popUpDiv").toggle("fast");
    });
            });

更新的 jsfiddle 链接是http://jsfiddle.net/Rm3sC/8/