Question

我已经在这几天工作了，我仍然无法弄清楚。

我使用jQuery构建了一个滑出式菜单，它可以工作。问题是，我希望打开它的菜单按钮也是关闭它的按钮。

我所做的是设置菜单按钮以使课程“无效”。默认情况下，theb设置一个点击事件处理程序来打开菜单，然后删除＆＃39; .inactive＆＃39;从元素类中添加类＆＃39; .active＆＃39;。然后我做了另一个功能，正好相反。问题是，第一个事件是完美的，但第二个事件并不适用。菜单打开，jQuery编辑HTML的样式，但是当我再次单击该按钮时，样式不会改变。

有没有办法覆盖第一个事件，以便可以执行第二个事件？很抱歉，如果这有一个我错过的非常基本的解决方案，但这里是脚本：

$(document).ready(function(){

    $('.inactive').click(function() {
        do_animations();
        //'.menu-button i' below is the menu button which gets the active/inactive classes//
        $('.menu-button i').addClass('active');
        $('.menu-button i').removeClass('inactive');
    });

    $('.active').click(function() {
        do_animations();
        $('.menu-button i').addClass('inactive');
        $('.menu-button i').removeClass('active');
    });
});

如果您需要，我可以提供代码的所有细节，但这些是重要的部分，所以不要太久。我确定所有语法都是正确的，并且我没有在开发人员工具中收到任何错误。

Answer 1

您可以在此处使用事件委派。这样的事情应该有效：

$(document).ready(function(){
    //body will work but preferably the container of these elements would be best
    $('body').on('click', '.inactive', function() {
        do_animations();
        //'.menu-button i' below is the menu button which gets the active/inactive classes//
        $('.menu-button i').addClass('active');
        $('.menu-button i').removeClass('inactive');
    });

    $('body').on('click', '.active', function() {
        do_animations();
        $('.menu-button i').addClass('inactive');
        $('.menu-button i').removeClass('active');
    });
});

这可以说：在任何地方点击身体。检查元素是否具有类.inactive，如果这样调用该函数。

之前的解决方案是：查找页面中的所有元素并在其上注册此回调。因此，当它使用.active标签搜索元素并找不到时。它没有注册回调。

如何覆盖（？）jQuery事件？

1 个答案: