如何隐藏和显示DIV

Question

我有非常小的事情，那就是：

我有两个div，被称为“第一”，“第二”。最初，div“second”隐藏，div“first”在页面加载时可见。一旦我将鼠标悬停在div“第一个”上，“second”div就可见并且“第一个”隐藏起来。现在我想要它，然后当我从“第二”div中移出时，“第一”div应该可见，“second”应该隐藏。我的问题是，我第一次将鼠标悬停在“first”div上时，“second”会变为可见，但后来鼠标悬停不起作用，“second”div未隐藏。

$('#first').hover(function(){ 
$('#second').hide(); 

}); 


$('#second').onmouseover(function(){ 
$('#second').hide(); 
$('#first').show(); 

}); 
<div id="first"> First </div> 
<div id="second"> Second </div> 

Answer 1

没有onmouseover功能，您可以使用mouseover或.on('mouseover',.....)

你可以这样做：

$('#first').on('mouseover', function(){ 
    $('#second').show(); 
    $('#first').hide(); 
}); 

$('#second').on('mouseout', function(){ 
    $('#first').show(); 
    $('#second').hide(); 
}); 

Fiddle Demo

Answer 2

Working Fiddle

$('#first').on('mouseover', function(){ 
    $('#second').show(); 
    $('#first').hide(); 
}); 

$('#second').on('mouseout', function(){ 
    $('#first').show(); 
    $('#second').hide(); 
});