我无法在jQuery中单击以切换div的类
预期的行为:我想在汉堡菜单中添加close类,以使其在单击时成为十字形,并希望为移动屏幕显示一个叠加层,但是目前,我只想弄清楚如何触发此onclick事件。
这是我用来执行此操作的代码:
$("#mobile-menu").click(function() {
$(".icon").toggleClass("close");
var x = document.getElementsByClassName("overlay")[0];
if ($(".icon").hasClass("close")) {
x.style.display = "block";
$("body").addClass("modal-open");
} else {
x.style.display = "none";
$("body").removeClass("modal-open");
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mobile-menu">
<div class="icon">
<span class="line top"></span>
<span class="line middle"></span>
<span class="line bottom"></span>
</div>
</div>