如何保持气泡(工具提示)进行编辑(javascript)

Question

我有一个像div这样的气泡，当将div悬停在上面时会出现。在气泡div 中，有一个文本框。

我如何使您可以将鼠标悬停在div 上，气泡会出现，然后您可以将鼠标悬停在气泡上，在文本框内进行编辑，当光标既不接触气泡也不接触文本框时，气泡消失？

而且不是，我不想要它，这样您就可以将鼠标悬停在气泡上并让它出现，只能先将鼠标悬停在div 上，然后是气泡。

谢谢！

Answer 1

这

太容易了

泡泡

你的泡泡！父级您的div ID

我们来了

$('#parent').hover(function(){
   $('#bubble').fadeIn();        
});
$('#bubble').click(function(){
    $(this).fadeOut();        
});

---

还有一件事，如果你的页面中有很多气泡你能做到吗，你的气泡代码在悬停时在任何你想要的div中，这个气泡显示并将代码更改为"代码下"具有气泡的div ，具有"工具提示"类，而气泡具有类"气泡"

$('.tooltip').hover(function(){
   if($('.bubble',this).hasClass('active')) return false ; // if this bubble is show , do nothing
   $('.bubble.active').fadeOut();// hide any other bubble that is show
   $('.bubble',this).fadeIn().addClass('active'); // show this bubble        
});
$('.bubble').click(function(){
    $(this).fadeOut().removeClass('active');        
});

<</div> div class="one_answers">

因为问题是关于javascript而不是jQuery的：

    document.getElementById('mydiv').addEventListener('mouseover', function(
        document.getElementById('mybubble').style.visibility='visible';
    ));
    document.getElementById('mybubble').addEventListener('click', function(
        document.getElementById('mybubble').style.visibility='hidden';
    ));
    document.getElementById('mydiv').addEventListener('click', function(
        document.getElementById('mybubble').style.visibility='hidden';
    ));