Javascript 带有链接的Div在我可以使用它之前消失（jquery hide/show）

我有一个图标，当我将鼠标悬停在上面时，它会显示一个带有链接的div。用户应该能够单击此链接，但当鼠标离开图标时，该链接将消失。有人知道我如何防止这种情况发生吗

守则：

$('.div1').hover(function(e){   
    e.preventDefault();
    e.stopPropagation();
    $(this).next().show('fast');
},
function(e){
    e.preventDefault();
    e.stopPropagation();    
    $(this).next().hide('fast');
});

我制作了一个JSFIDLE来说明问题：

---

问题在于，当您尝试单击链接时，会留下img标签。我建议把所有的东西都包起来，并在这个包上调用鼠标悬停

这里有一把小提琴：

HTML部分：

<div class="wrapper">
<img class="domaininfo" src="http://domeinwinkel.sitestatus.nl/gfx/itje.png">
<a class="domain-info-window" id="domain-info-window-2" href="#">
Is deze domeinnaam bij een andere provider geregistreerd maar wil je profiteren van de voordelen van Domeinwinkel? Verhuizen naar Domeinwinkel is snel geregeld!
</a>
</div>

---

当您将鼠标悬停在图像上时，将显示div。 如果你想链接消失，只有当你点击它，我想这可以帮助你

enter code here

 $('.domaininfo').hover(function (e) {
          e.preventDefault();
          e.stopPropagation();
          $(this).next().show('fast');
    },function (e) {
            e.preventDefault();
            e.stopPropagation();
            $('.domain-info-window').click(function (e) {
                $(this).hide();
            });
        });

<div class="wrapper">
<img class="domaininfo" src="http://domeinwinkel.sitestatus.nl/gfx/itje.png">
<a class="domain-info-window" id="domain-info-window-2" href="#">
Is deze domeinnaam bij een andere provider geregistreerd maar wil je profiteren van de voordelen van Domeinwinkel? Verhuizen naar Domeinwinkel is snel geregeld!
</a>
</div>

.domaininfo {
    position: relative;
    top: 0px;
    left: 0px;
}

enter code here

 $('.domaininfo').hover(function (e) {
          e.preventDefault();
          e.stopPropagation();
          $(this).next().show('fast');
    },function (e) {
            e.preventDefault();
            e.stopPropagation();
            $('.domain-info-window').click(function (e) {
                $(this).hide();
            });
        });