我对 HTML、CSS 和 JavaScript 的学习还比较陌生。我正在创建一种测试网站，仅用于学习目的，并已开始深入研究移动响应网站。
我有一个测试站点，其中隐藏了一个移动导航按钮，并使用 CSS 媒体查询将显示设置为阻止并隐藏正常的导航菜单。我还有移动导航菜单的列表项。为了显示/隐藏它，我创建了一个 .toggleClass() jQuery 函数:
function clicktouchmenu()
{
$('#menuico').on('click touch', function()
{
var $mobmen = $(".mobilemenu");
$mobmen.toggleClass('clicked');
});
};
上面的代码有效，但我想在菜单中添加一个 .slideToggle() 以获得效果。如果我将其添加到 .toggleClass() 下方，作为 $('.clicked').slideToggle(); 如果我单击菜单图标，没有任何反应，但反复点击，它似乎开始工作并开始上下滑动。
由于我对此还很陌生，我希望我这样做完全错误，或者使可能非常简单的事情变得过于复杂。
最佳答案
尝试删除 clicked 类并仅在 mobilemenu 上使用 slideToggle()，如下所示:
$('#menuico').on('click touch', function()
{
var $mobmen = $("#mobilemenu")
$mobmen.slideToggle();
});
我认为问题在于，如果 clicked 类切换是否显示菜单，那么它会干扰 slideToggle()。这是因为 slideToggle() 的目的是让某些东西看起来像是滑入和滑出 View (也称为切换它是否隐藏但带有动画)。因此，您只需要其中之一，但 slideToggle() 显然包含动画。
我添加了一个 fiddle ，但这只是一个演示，因为我不知道你的 HTML 或 CSS 是什么样的:
fiddle :https://jsfiddle.net/668mucca/3/
链接到 jQuery 文档中 slideToggle() 的条目以获取良好的测量结果:http://api.jquery.com/slidetoggle/
关于javascript - jQuery-toggleClass + slipToggle 未按预期工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43273994/