Jquery 显示选择列表后触发悬停

我有一个具有悬停功能的div：

d = $("<div></div>");
d.hover(function() {        
    $(this).stop();
    $(this).animate({
        'margin-left' : '-250px'
    }, 250, function () {
    });
}, function() {
    $('input').blur();
    $(this).stop();
    $(this).animate({
        'margin-left' : '-10px'
    }, 250, function () {
    });
});
$('body').append(d);   

在这个div中，我动态创建了一个下拉菜单。我是这样用的

box3 = $("<p></p>");
box3.val('Create');
box3.html(  '<u>All attributes</u><br>'+                        
            '<select id="attSelect"></select><BR>'


);      

d.append(box3);

之后，我用选项填充select

现在，当单击选择菜单的下拉按钮显示选择列表时，将触发悬停的第二个功能。这是因为鼠标不再在div上方

---

在我尝试在“取消选择”中选择某些内容后，如何防止div hover功能被激活？

您的答案在这里。如果你能提供一把小提琴，那就太好了。。