Jquery 防止日期选择器触发父鼠标删除

我用jQuery

$显示一个绝对的
div
。在jQuery
$上设置动画（{height:'toggle'，opacity:'toggle'}）
。hover（）

我在前面提到的绝对

div

中有一个jQuery UI日期选择器，它带有

changeMonth:true

和

changeYear:true

更改月份或年份或选择日期时，将触发动画

如何防止月/年更改和日期选择触发

$.hover（）

html

<div id="hoverAnchor">hover me</div>
<div id="hoverMe" style="display:none">
    arbitrary text
    <div id="dateSelector"></div>
</div>

---

你需要做几件事才能让它正常工作

首先，您需要将HTML包装在

div

中作为容器：

HTML:

演示：

---

希望这有帮助

泰！看到它必须进入迭代18。我一定很喜欢jquery的ui限制，哈哈。我在没有

#container

的情况下进行了修改，它成功了。我错过什么了吗？我不知道这是怎么回事。哈哈，非常感谢@JoeCoderGuy不用担心！代码在不使用

#container

的情况下仍然可以工作，但是

#container

可以充当一种缓冲区。假设您希望确保在单击列表下方的输入值时，

#hoverme

不会切换（请尝试在月份中单击

Dec

）。然后，您可以将

填充

添加到容器中，使其环绕所有内容。下面是一个演示，演示我所说的内容：。只有在“缓冲区”之外移动才会导致

#hoverme

切换。希望这有意义！您认为您可以修改以帮助解决此问题吗？

$(document).ready(function () {
    
    $("#dateSelector").datepicker({
        changeMonth: true,
        changeYear: true
    });
    
    $("#hoverAnchor").add($("#hoverMe")).hover(function(){
        $("#hoverMe").stop(true,false).animate({
            height: 'toggle',
            opacity: 'toggle'
        }, 200);
    });
    
});

<div id="container">
    <div id="hoverAnchor">hover me</div>
    <div id="hoverMe" style="display:none">arbitrary text
        <div id="dateSelector"></div>
    </div>
</div>

$(document).ready(function () {
    $("#dateSelector").datepicker({
        changeMonth: true,
        changeYear: true
    });
    var _enter = false;
    $("#container").add(
    $("#container")).mouseenter(function () {
        if (!_enter) {
            $("#hoverMe").stop(true, false).animate({
                height: 'toggle',
                opacity: 'toggle'
            }, 200);
        }
        _enter = true;
    }).mouseleave(function () {
        _enter = false;
        $("#hoverMe").stop(true, false).animate({
            height: 'toggle',
            opacity: 'toggle'
        }, 200);
    });
});