对话框中的 jquery 日期选择器

Question

我想在对话框中使用 jquery 日期选择器。日期选择器应在焦点上触发(默认)。由于文本框是对话框中的第一个字段，因此它自动具有焦点。这会产生在首次打开对话框时打开日期选择器的不良效果。

我尝试了很多不同的方法，例如将焦点设置为虚拟 href，在对话框打开后调用 datepicker('close')，将 showOn 设置为“按钮”，然后在对话框打开后更改为“焦点”，但是没有工作。

日期选择器仅应在文本框获得焦点时呈现，对话框首先打开时除外。

我的片段

$(function() {
    $('#btnDialog').click(function() {
        $('#myDate').datepicker({
            title: 'Test Dialog'
        });
        $('#myDialog').dialog();
    });
});​

JS fiddle 链接:http://jsfiddle.net/UkTQ8/

Answer 1

在打开时创建日期选择器并在关闭时销毁它:

$(function() {
    $('#btnDialog').click(function() {
        $('#myDialog').dialog({
            open: function() {
                $('#myDate').datepicker({title:'Test Dialog'}).blur();
            },
            close: function() {
                $('#myDate').datepicker('destroy');
            },
        });
    });
});

演示:http://jsfiddle.net/UkTQ8/7/