JQuery菜单打开，但随后消失

我有一个我设计过的菜单，但当我点击菜单时，它会闪烁打开，然后立即关闭，点击几下后，整个菜单就会消失！有什么理由可以解释为什么会这样做

我需要换掉吗？换别的吗？ 我使用的是jquery的最新版本

另外，需要知道是否有更好的方法来集中链接

/*流动的*/
@仅介质屏幕和（最大宽度：600px）{
.汉堡导航{
边框：1px纯黑；
显示：块；
文本对齐：居中；
宽度：100%；
光标：指针；
背景：404040；
}
.材质图标{
颜色：白色；
}
标题导航ul{
溢出：隐藏；
背景:#505050；
身高：0；
}
收割台导航ul打开{
高度：自动；
}
标题nav ul li{
列表样式：无；
宽度：100%；
保证金：0；
文本对齐：居中；
}
标题nav ul li a{
颜色：#fff；
填充：0.625em；
边框底部：1px实心#404040；
显示：块；
保证金：0；
}
}
/*正常的*/
@仅介质屏幕和（最小宽度：600px）{
navbar先生{
列表样式：无；
显示器：flex；
证明内容：周围的空间；
字号：1.5em；
文本对齐：居中；
字体系列：“Poppins”，无衬线；
}
.导航链接{
文字装饰：无；
颜色：继承；
文本转换：大写；
}
.导航栏包装{
背景色：#949699；
填充：2em 0；
长方体阴影：插入-0.25em0.25em0 rgba（0,0,0,0.1）；
}
.navlink:悬停{
边框底部：1px纯色浅灰色；
}
.汉堡导航{
显示：无；
}
}
$（文档）.ready（函数（）{
$（“.burger nav”）。在（'click'，function（）上{
$（“标题导航ul”）。切换类别（“打开”）；
});
});

问题在于ul上的

高度：0

和

ul上的自动高度设置。打开
，而不是将高度设置为0，只需使用
display:block
和
display:none
显示/隐藏即可

此外，导航正在消失，因为您的href对于burger导航链接是空的，我已经用这些更改更新了代码笔

header nav ul {
  overflow: hidden;
  background: #505050;
  display: none;
  /*height: 0;*/
}

header nav ul.open {
  /*height: auto;*/
  display: block;
}


导航现在可以按预期进行切换。
太棒了！谢谢，我没想到href会这么做，谢谢！
header nav ul {
  overflow: hidden;
  background: #505050;
  display: none;
  /*height: 0;*/
}

header nav ul.open {
  /*height: auto;*/
  display: block;
}