javascript悬停动态失败

Question

海iam试图将悬停在动态图像必须显示动态股利，如果删除鼠标div必须隐藏，如果我在图像div上悬停后需要保持可见，如果我结束后的div从div中移出它必须被隐藏我试过这样的东西，但没有按预期工作，如果我在图像div出现，如果我将鼠标移出标记在那里它隐藏div一旦我删除鼠标无法使用选项在div中，如果我将鼠标放在div中，一旦我从图像中移除鼠标div不关闭，对于这种情况下的解决方案，不好的英语感到抱歉？

function GoView_respond(id){ 
 
     console.log('hovering'); 
 
     document.getElementById("pending_req_"+id).style.display="block"; 
 
    } 
 

 
    var cl=0; 
 

 
    function ExitView_respond(id){ 
 
    console.log('not hovering'); 
 
    if(cl!=1){ 
 
    document.getElementById("pending_req_"+id).style.display="none"; 
 
    } 
 
}

<a onmouseover="GoView_respond('1');" onmouseout="ExitView_respond_one('1');">over_here</a> 
 
      <div class="respond_request" style="display:none;" id="pending_req_1" > 
 
       <p class="user_details" onmouseout="ExitView_respond('1');">asdfasdfasfsdffsadfsadfasf</p> 
 
      </div>

Answer 1

下面的代码可以帮助您解决问题：

Javascript代码：

function GoView_respond(id){ 
     console.log('hovering'); 
     document.getElementById("pending_req_"+id).style.display="block"; 
     cl = 1; 
    } 

    var cl=0; 

    function ExitView_respond(id){ 
    console.log('not hovering'); 
    if(cl!=1){ 
    cl=0; 
     document.getElementById("pending_req_"+id).style.display="none"; 
    } 
} 

function GoView_respond_one(id) { 

    setTimeout(function() { 
     if(cl == 1) { 
     cl = 0; 
     document.getElementById("pending_req_"+id).style.display="none"; 
     } 
    }, 2000); 
    } 
} 

和HTML代码如下

<a onmouseover="GoView_respond('1');" onmouseout="GoView_respond_one('1');">over_here</a> 
      <div class="respond_request" style="display:none;" id="pending_req_1" > 
       <p class="user_details" onmouseover="GoView_respond('1');" onmouseout="ExitView_respond('1');">asdfasdfasfsdffsadfsadfasf</p> 
      </div> 

Demo Link供您参考。