javascript - 模态窗口中的jQuery日期选择器问题

我使用以下代码创建了模式窗体/窗口：

    $(function () {
        var widthLen = window.screen.width - 10;
        var heightLen = window.screen.height - 120;
        $("#dialogOperation").dialog({
            width: widthLen,
            height: heightLen,
            closeOnEscape: true,
            modal: true,
            close: function () {
                window.location.href = "OperationMenu.aspx"
            }
        });
    });

带有附加了日期选择器和按钮的文本框。除一个小问题外，其他所有内容都正常运行-每当有回发时，日期选择器日历都会一直显示。在每个控制事件之后，都会显示日历。

我要发生的是仅在单击非模式对话框形式中的文本框时才显示日历。

当我尝试使用以下方法隐藏日期选择器时：

    $(document).ready(function () {
        $('#txtDate').datepicker('hide');
    });

即使我将焦点放在文本焦点上，我也无法再显示日历：

    $("#txtDate").focus(function () {
        $('#txtDate').datepicker();
    }).blur(function() {
        $('#txtDate').datepicker('hide');
    });

我也尝试过将z-index：1003放在jquery的css中，但是我仍然没有很多运气。

.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; z-index: 1003; }

任何可以帮助我解决此问题的人将不胜感激。

提前致谢！！

问候，
哈兰

最佳答案

您都可以使用选项showOn
http://docs.jquery.com/UI/Datepicker#option-showOn

或者先禁用日期选择器，然后使用对话框的open事件将其启用。关闭对话框时禁用。

open: function(){
    $('#txtDate').datepicker('enable');

},
close: function() {
    $('#txtDate').datepicker('disable');
}

演示：http://jsfiddle.net/diode/Xawe2/

关于javascript - 模态窗口中的jQuery日期选择器问题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8954758/