Javascript 设置超时不工作

我看到过一些关于类似问题的帖子，但我是一个js新手，所以我很难将这些点连接起来，以明确我的代码需要如何更改，希望有人能让我明白

我试图创建一个函数，它将在mouseover上显示一个指定的元素，然后在mouseout上再次隐藏它。我在这里挣扎的地方是，我需要在元素消失之前有一个延迟。我以前从来没有在函数中真正使用过时间延迟，所以我有点挠头想让它工作起来

通过一点在线研究，似乎我可以直接将“setTimeout”插入标签上的onmouseout属性，然后简单地包含隐藏函数和时间长度，但这似乎不起作用

标记第1部分（重要部分是标记）：

标记第2部分（隐藏或显示的项目）：

清单项目1
清单项目2
清单项目3


清单项目4
清单项目5
清单项目6


清单项目7
清单项目8
清单项目9


清单项目10
清单项目11
清单项目12


清单项目13
清单项目14
清单项目15


清单项目16
清单项目17
清单项目18

js：

<script type="text/javascript">
    function toggle_visibility(id) {
        var e = document.getElementById(id);
        if (e.classList.contains('hide')) {
            e.classList.add('show');
            e.classList.remove('hide');
        } else {
            e.classList.add('hide');
        }

    }

    function toggle_hidden(id) {
        var e = document.getElementById(id);
        if (e.classList.contains('show')) {
            e.classList.add('hide');
        }            
    }
</script>

功能切换\u可见性（id）{
var e=document.getElementById（id）；
if（e.classList.contains（'hide'））{
e、 添加（'show'）；
e、 移除（'hide'）；
}否则{
e、 添加（'hide'）；
}
}
函数切换隐藏（id）{
var e=document.getElementById（id）；
if（e.classList.contains（'show'））{
e、 添加（'hide'）；
}            
}

---

提前感谢您对我应该如何处理此问题提出的任何建设性建议。

您没有将

toggle\u hidden

传递到

setTimeout

以便在2秒钟内调用，而是立即调用它

onmouseout="setTimeout(function(){ toggle_hidden('groupOne'); }, 2000)"

---

您没有将

toggle_hidden

传递到

setTimeout

以在2秒钟内调用，而是立即调用它

onmouseout="setTimeout(function(){ toggle_hidden('groupOne'); }, 2000)"

---

您正在立即调用函数

toggle_hidden

，而不是传递引用

您可以使用

bind

将参数绑定到它。因此，改变：

toggle_hidden('groupTwo')

致：

---

…等等。

您正在立即调用函数

toggle\u hidden

，而不是传递引用

您可以使用

bind

将参数绑定到它。因此，改变：

toggle_hidden('groupTwo')

致：

---

…等等。

老兄，动作很快，谢谢！它似乎已经解决了这个问题，我会在十分钟结束后将其标记为答案，我可以。哥们，这很快，谢谢！它似乎已经解决了这个问题，一旦十分钟结束，我会把这个标记为答案，我可以。

toggle_hidden.bind(null, 'groupTwo')