Javascript 单击其他内容时将响应的下拉菜单

我有这个下拉菜单解决方案

我需要隐藏当我点击另一行时显示的一个下拉菜单，并显示它的下拉菜单。我还需要第一行下拉菜单，以显示总是当人们去网站

我希望我正确地描述了我的问题，你能帮助我吗

//下拉菜单
var dropdown=document.querySelectorAll（'.dropdown'）；
var dropdownArray=Array.prototype.slice.call（下拉，0）；
dropdownArray.forEach（函数（el）{
var button=el.querySelector（'a[data toggle=“dropdown”]”），
menu=el.querySelector（“.下拉菜单”），
arrow=button.querySelector（'i.icon-arrow'）；
button.onclick=函数（事件）{
如果（！menu.hasClass（'show'））{
menu.classList.add（'show'）；
menu.classList.remove（'hide'）；
arrow.classList.add（'open'）；
arrow.classList.remove（'close'）；
event.preventDefault（）；
}否则{
menu.classList.remove（'show'）；
menu.classList.add（'hide'）；
arrow.classList.remove（'open'）；
arrow.classList.add（'close'）；
event.preventDefault（）；
}
};
})
Element.prototype.hasClass=函数（类名）{
返回this.className&&new RegExp（“（^ |\\s）”+className+“（\\s |$）”））.test（this.className）；
};
ul{
列表样式：无
}
.下载{
文字装饰：无；
}
.dropdown[数据切换=“dropdown”]{
位置：相对位置；
显示：块；
颜色：黑色；
填充：10px；
}
.下拉菜单.下拉菜单{
最大高度：0；
溢出：隐藏；
}
.下拉菜单.下拉菜单{
填充：0；
}
.下拉菜单.下拉菜单a{
显示：块；
填充：10px 10px；
}
.下拉列表.显示{
显示：块；
最大高度：9999px；
左边距：50像素；
}
.下拉.隐藏{
最大高度：0；
}



























一次只能打开一个可折叠元素的多个可折叠元素的行为类似于手风琴。总体思路是首先关闭所有可折叠文件，然后打开用户选择的文件。下面的演示通过以下方式展示了该行为

顺便说一句，我注意到你做了一个
hasClass
。。。呃班。这不是必需的，只需使用：
node.classList.contains（'class'）

详细信息将在演示中进行注释

演示

/*已将主类添加到父类

||通过将eventListener添加到
||多个可单击节点的父节点
||并使用e.target属性查找
||确切的节点实际点击，我们
||只是需要
来倾听
||而不是3个独立的

||这是事件发展的一部分
*/
var main=document.querySelector（'.main'）；
main.addEventListener（'click'，accordion，false）；
功能手风琴（e）{
/*集合所有。下拉菜单到节点列表
||然后将其转换为数组
*/
var dropArray=Array.from（document.querySelectorAll（'.dropdown menu'））；
/*收集.下拉菜单中的所有链接以
||节点列表然后将其转换为数组
*/
var linxArray=Array.from（document.queryselectoral（'a+.dropdown menu a'）；
/*如果单击的节点（如目标）不是
||节点侦听事件（如currentTarget
||（梅因）然后。。。
*/
如果（e.target！==e.currentTarget）{
//将e.target分配给var tgr
var tgr=e.target；
/*如果tgr具有数据切换属性。。。
||查找tgr下一个同级（.dropdown menu）
||使用一个
||循环
||删除。显示和添加。隐藏在
||dropArray中的每个.下拉菜单
||然后添加。显示和删除。隐藏
||关于tgt
||最后从中停止单击事件
||冒泡，从而阻止任何事情
||否则会被触发。
*/
if（tgr.hasAttribute（'data-toggle'））{
//停止
























关于
服务
接触

第一节
第二节
第三节
第四节
在这篇文章中包含你尝试过但失败的JavaScript。继续阅读我不能包含它，它对我不起作用。所以你知道将来：单击带括号的图标：
无论如何，我为你编辑了你的文章。谢谢你，你是一个英雄！：）没问题，编码愉快。嗨，我发现了问题，当我单击扩展内容时，con帐篷被删除了。你能帮我解决这个问题吗？问题在哪里？嗨，你只是在运行答案中的代码，还是将此代码添加到另一个页面？我将此代码添加到另一个页面，但这里有一个相同的问题，我单击子菜单的地方被删除了，但我不想要它。