Question

我的页面中有2个元素，我想在用户点击2个不同的按钮时显示它们。

这是我的代码

$('.social-toggle').on('click', function() {
  $(this).next().toggleClass('open-menu');
});

$('.social-toggle1').on('click', function() {
  $(this).next().toggleClass('open-menu');
});

当用户点击第一个按钮时，第一个元素将会显示，但我希望用户点击第二个按钮或打开菜单中的一个链接，关闭第一个打开的菜单。

JSFIDDLE

Answer 1

您不需要在此处编写两个不同的事件。使用逗号分隔的多个选择器来定位两个按钮：

$('.social-toggle,.social-toggle1').on('click', function() {
  $('.social-networks').not($(this).next()).removeClass('open-menu');
  $(this).next().toggleClass('open-menu');
});

<强> Working Demo

Answer 2

Here是您想要的代码。您没有删除之前应用的类。

$('.social-toggle').on('click', function() {
    $('.social-toggle1').next().removeClass('open-menu');
  $(this).next().toggleClass('open-menu');

});

$('.social-toggle1').on('click', function() {
    $('.social-toggle').next().removeClass('open-menu');
  $(this).next().toggleClass('open-menu');
});

Onclick应该关闭其他打开的元素

2 个答案: