Jquery 一个适用于悬停的简单脚本，但为什么'；我不能让它为点击工作吗？

我有一个非常简单的用于悬停的js脚本，但我想将悬停转换为单击功能。但当我尝试将鼠标悬停切换为单击时，它不起作用

下面是完整的示例脚本，仅供参考。当有人将鼠标悬停在这个类上时，下面会出现一个带有背景的小文本。

这是我试过的

如果有人能帮我把悬停转换成点击，我将不胜感激

---

谢谢，

如果您想通过单击切换元素的状态，您需要将其状态存储在其他地方——要么是全局变量（不是一个好习惯），要么是元素本身的

.data（）

变量

例如：

$(".menu a").bind('click', function () {
    $el = $(this).next('em');
    if ($el.data('switched')) {
        $el.data('switched',false)
           .animate({
            opacity: 1,
            bottom: "-155"
        }, "fast");
    } else {
        $el.data('switched',true)
           .animate({
            opacity: 0,
            bottom: "-165"
        }, "fast");
    };
});

试着像下面这样

$(document).ready(function() {
    $(".menu a").click(function() {
        var $this = $(this);

        if (!$this.hasClass('clicked')) {
            $this.next("em").animate({
                opacity: "show",
                bottom: "-155"
            }, "fast");

            $this.addClass('clicked');
        } else {
            $this.next("em").animate({
                opacity: "hide",
                bottom: "-165"
            }, "fast");

            $this.removeClass('clicked');
        }

    });
});

---

Jquery有一个内置的函数来实现这一点。

我强烈建议不要将代码示例发布到SO上。请检查它是否可以工作。我猜，你在别的地方出错了。你能用它代替pastebin吗？啊，这太棒了，非常感谢！很抱歉，下次我会使用JSFIDLE谢谢大家！

       $(document).ready(function(){
            $(".menu a").toggle(function() {
                 $(this).next("em").animate({opacity: "show", bottom: "-155"}, "fast");
            }, function() {
                 $(this).next("em").animate({opacity: "hide", bottom: "-165"}, "fast");
            }); 
        });