如何使用on（）切换元素？

Question

我使用Hammer.js库移动触摸事件，并在其与jQuery的使用例子，他们有以下几点：

$('#test_el').hammer().on("tap", ".nested_el", function(event) { 
    console.log(this, event); 
}); 

这是简单的;不过，我想将切换行为合并到#test_el。

$('button').hammer().on("tap", function() { 
    $('div').addClass('open'); 
}, function { 
    $('div').addClass('close'); 
}); 

我将如何得到这个“开关”行为的工作：换句话说，如果上面的例子是像这样的东西所取代？

Answer 1

最初，您可以将起始类添加到所有按钮。然后在活动中，您可以检查课程是否存在。这可以让你知道当你点击它时元素处于什么状态。

$('button').addClass('close'); 

$('button').hammer().on('tap', function() { 
    if ($(this).hasClass('close')) { 
    $(this).removeClass('close').addClass('open'); 
    // Event code 
    } 
    else { 
    $(this).removeClass('open').addClass('close'); 
    // Event code 
    } 
}); 

Answer 2

jQuery还提供了一个toggleClass方法。

Answer 3

JQuery中已经有一个toggleClass函数可用，它看起来可以实现你想要的功能。

Answer 4

尝试：

$('#test_el').hammer().on("tap", ".nested_el", function(event) { 
    $(this).toggleClass("classnamehere"); 
}); 

凡classnamehere将是你的类名。