Question

这是jsfiddle ：

我有一个名为divEtime的div，只有当您将鼠标悬停在li内的ul项目上时才会显示：

这是jquery：

$('#dEtime').hide();

            $(".eTime").hover(function () {
                $('#dEtime').fadeIn('slow');
            }, function () {
                $('#dEtime').fadeOut('slow');
            });

这是显示div的html以及包含类li

的eTime项

<ul id="ulPersonal">
      <li class="break eTime">
        <a href="http://someURL" title="t" target="_blank"><img src="./images/etime.png" alt="E-Time" /></a>
        <a href="http://someURL" title="t" target="_blank">t</a>
        <p>Manage</p>
        <div id="dEtime">
            <asp:TextBox ID="txtEtimeStart" runat="server" CssClass="datePickerDueDate" 
                         Width="75px"></asp:TextBox>
           Some content
        </div>
      </li>
  ...
</ul>

问题是我还有一个文本框txtEtimeStart，它使用jquery的日期选择器：

$(".datePickerDueDate").datepicker(
                    {
                        firstDay: 1,
                        constrainInput: false,
                        changeYear: true,
                        changeMonth: true,
                        selectOtherMonths: true,
                        showWeek: true
                    });

请注意，html发布的文本框中有一个名为.datePickerDueDate的类。所以我的问题是当你打开日期选择器并向下移动鼠标以选择文本框的值（在div中）时，div会再次淡出。看来，当我浏览日历控件（jquery日期选择器）时，鼠标悬停在div上已经失去焦点导致div隐藏。

在从日历中选择日期时，是否可以保持div打开？否则会发生什么是div隐藏但日历仍然是开放的。我仍然可以选择一个日期但是我必须再次将鼠标悬停在div上才能看到该值。

Answer 1

您也可以在JQuery语句中选择日历的ID，然后使用stop()

http://jsfiddle.net/93Fp2/27/

$(".eTime, #ui-datepicker-div").hover(function () {
            $('#dEtime').stop().fadeIn('slow');
        }, function () {
            $('#dEtime').stop().fadeOut('slow');
});

打开日历时保持div打开

1 个答案: