Javascript 如何为选项卡添加onmouseout，以使选项卡内容赢得'；老鼠出没的时候你不来吗？

我试图为tab函数添加一个onmouseout，我使用的是w3schools tab示例，它有一个onmouseover，当在tablink上悬停时会显示tabcontent，但内容保留在其中，onmouseout可能会解决我的问题，唯一的问题是我不知道如何绕过它。谢谢

范例

函数openCity（evt，cityName）{
//声明所有变量
var i，tabcontent，tablinks；
//使用class=“tabcontent”获取所有元素并隐藏它们
tabcontent=document.getElementsByClassName（“tabcontent”）；
对于（i=0；i

伦敦
巴黎
东京
伦敦
伦敦是英国的首都

巴黎
巴黎是法国的首都

东京
东京是日本的首都

将鼠标输出侦听器添加到选项卡

div

const tabs = document.querySelector('.tab');

tabs.addEventListener("mouseout", function( event ) {    
      // Get all elements with class="tabcontent" and hide them
      const tabcontent = document.getElementsByClassName("tabcontent");

      for (i = 0; i < tabcontent.length; i++) {
        tabcontent[i].style.display = "block";
      }
 }, false)

const tabs=document.querySelector（'.tab'）；
tabs.addEventListener（“mouseout”，函数（事件）{
//使用class=“tabcontent”获取所有元素并隐藏它们
const tabcontent=document.getElementsByClassName（“tabcontent”）；
对于（i=0；i

函数openCity（evt，cityName）{
//声明所有变量
var i，tabcontent，tablinks；
//使用class=“tabcontent”获取所有元素并隐藏它们
tabcontent=document.getElementsByClassName（“tabcontent”）；
对于（i=0；i

伦敦
巴黎
东京
伦敦
伦敦是英国的首都

巴黎
巴黎是法国的首都

东京
东京是日本的首都

看起来像一个简单的打字错误，ID不能有空格（

London2

而不是

London2

），而且你没有巴黎和东京的div。将此样式更改为此解决方案是我一直在寻找的。tabcontent[i].style.display=“无”；}，（错误）