单击后退箭头在JavaScript中无法正常工作

这是我的html和JavaScript代码，我希望在这项任务中得到帮助，在我来回进入子菜单几次之后，元素的填充变得混乱，图标被切断。 有时它工作正常，但当我点击返回箭头非常快，它弄乱了填充物

我也在分享截图

$（文档）.ready（函数（）{
//变量声明。。。
变量左，宽度，新左；
//将“顶级菜单”类添加到顶级菜单。。。
$（'.mobile menu'）。children（'ul'）。addClass（'top-menu'）；
//将按钮添加到具有子菜单的项。。。
$（'.has_child_menu'）。追加（''）；
//移动菜单切换功能
$（'.menu toggle'）。打开（'单击'，函数（）{
//检测是否正在显示移动菜单。。。
display=$（'.mobile menu'）.css（“display”）；
如果（显示==‘无’）{
//显示菜单。。。
$（'.mobile menu'）.css（“显示”、“块”）；
}否则{
//隐藏移动菜单。。。
$（'.mobile menu'）.css（“显示”、“无”）；
//并重置移动菜单。。。
$（'.current menu'）.removeClass（'current-menu'）；
$（'.top menu'）.css（“左”，“0”）；
$（'.back按钮'）.css（“显示”、“无”）；
}
});
//显示子菜单的功能。。。
$（'.arrow'）。在（'click'，function（）上{
//.current菜单将不再是当前菜单，因此请删除该类。。。
$（'.current menu'）.removeClass（'current-menu'）；
//打开子菜单的“显示”属性
$（this）.sides（'ul'）.css（“显示”、“块”）.addClass（'current-menu'）；
left=parseFloat（$（'.top-menu'）.css（“left”）；
width=Math.round（$（'.mobile'）.width（））；
newLeft=左-宽度；
//将新菜单向左滑动（到.mobile视口中）。。。
$（'.top menu'）.css（“左”，newLeft）；
//同时显示“后退按钮”（如果隐藏）。。。
if（$（'.back按钮'）.css（“显示”）=“无”）{
$（'.back button'）.css（“display”，“flex”）；
}
});
//返回父菜单的功能。。。
$（'.back按钮'）。在（'click'，function（）上{
//隐藏后退按钮（如果当前菜单是顶部菜单）。。。
if（$（'.current menu'）.parent（）.parent（）.hasClass（'top-menu'））{
$（'.back按钮'）.css（“显示”、“无”）；
}
left=parseFloat（$（'.top-menu'）.css（“left”）；
width=Math.round（$（'.mobile'）.width（））；
newLeft=左+宽；
//将新菜单向左滑动（到.mobile视口中）。。。
$（'.top menu'）.css（“左”，newLeft）；
//允许0.25秒css转换完成。。。
setTimeout（函数（）{
//隐藏外出。当前菜单。。。
$（'.current menu'）.css（“显示”、“无”）；
//将.current菜单添加到新的当前菜单。。。
$（'.current menu'）.parent（）.parent（）.addClass（'current-menu'）；
//从输出子菜单中删除.current菜单类。。。
$（'.current-menu.current-menu'）.removeClass（'current-menu'）；
}, 250);
});
});
正文{
边际：0px；
填充：0px；
字体系列：“SegoeUI”；
}
.智能列表容器{
最大宽度：95%；
利润率：10px自动；
}
.智能列表标题{
背景：#265a88；
填充：10px 0px；
}
.当前页面标题{
文本对齐：居中；
}
.当前页面标题h3{
颜色：#fff；
边际：0px；
}
.smart行{}
.智能列表图标{
浮动：左；
宽度：60px；
}
.智能列表图标.fa{
字体大小：35px；
右边填充：20px；
}
.智能描述{
浮动：对；
宽度：计算（100%-60px）；
}
.智能文本{
浮动：左；
}
.智能文本h3{
保证金：0；
}
.智能右btn{
浮动：对；
}
.智能右btn.fa{
字号：28px；
}
.子列表{
显示：无；
}
.幻灯片智能页面{
左-100%；
位置：绝对位置；
过渡期：0.5s全部缓解；
}
正文.幻灯片智能子页{
显示：块；
}
.子列表{
背景：2196F3；
高度：300px；
}
/*******交换机*******/
.智能右btn.开关{
位置：相对位置；
显示：内联块；
宽度：60px；
高度：34px；
边缘底部：0px；
}
.智能右btn.开关输入{
显示：无；
}
.智能右btn.滑块{
位置：绝对位置；
光标：指针；
排名：0；
左：0；
右：0；
底部：0；
背景色：#ccc；
-webkit转换：.4s；
过渡：.4s；
}
.智能右btn.滑块：之前{
位置：绝对位置；
内容：“；
高度：26px；
宽度：26px；
左：4px；
底部：4px；
背景色：白色；
-webkit转换：.4s；
过渡：.4s；
}
.智能右侧btn输入：选中+.滑块{
背景色：#2196F3；
}
.智能右btn输入：焦点+.滑块{
盒影：0 0 1px#2196F3；
}
.智能右侧btn输入：选中+.滑块：之前{
-webkit转换：translateX（26px）；
-ms变换：translateX（26px）；
转化：translateX（26px）；
}
/*圆形滑块*/
.smart right btn.slider.round{
边界半径：34px；
}
.智能右btn.滑块.圆形：之前{
边界半径：50%；
}
/*******交换机btn端*******/
.智能列表容器.移动{
背景：#fff；
溢出：隐藏；
/*注意：如果您想更好地了解“引擎盖下”正在发生的事情，请删除此溢出属性*/
位置：相对位置；
}
.智能列表容器.移动控件{
背景#337ab7；
显示器：flex；
弯曲方向：行反向；
证明内容：之间的空间；
填充：10px；
}
.智能列表容器.移动控件按钮{
背景：无；
边界：无；
边界半径：8px；
颜色：#fff；
高度：40px；
填充：0 15px；
大纲：无；
字号：18px；
}
.智能列表容器按钮：悬停{
光标：指针；
}
.智能列表容器.移动控件.返回按钮{
显示：无；
}
.智能列表容器.移动菜单{
背景：#fff；
显示：无；
身高：100%；
左：0；
位置：绝对位置；
宽度：100%；
z指数：10；
}
.智能列表容器ul{
保证金：0；
填充：0；
宽度：100%；
位置：绝对位置；
过渡：0.25s；
}
.智能列表容器li{
边框底部：1px实心#ccc；
数字化信息系统