单击应关闭其他打开的元素

Onclick should close other opened element

本文关键字：元素 其他 单击      更新时间：2023-09-26

我的页面中确实有两个元素，当用户单击两个不同的按钮时，我想显示它们。

这是我的代码

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

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

JSFIDDLE

您不需要在这里编写两个不同的事件。使用逗号分隔的多个选择器同时针对两个按钮：

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

工作演示

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

$('.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');
});
相关文章：