如何设置日期选择器的显示位置？答案

【问题标题】：how to set the show position of datepicker?如何设置日期选择器的显示位置？
【发布时间】：2010-08-13 04:59:30
【问题描述】：

亲爱的，我的表单中有一个日期选择器。在我单击文本字段后，日期选择器显示为向上（与下拉相反）。如果我想显示 datepicker 下拉菜单而不是下拉菜单，我该怎么办？ http://img413.imageshack.us/img413/1460/screenshot5g.png

【问题讨论】：

你忘了在你的问题中提到 jQuery。没有人会知道你在说哪个日期选择器。我知道，因为我回答了你的最后一个问题:)
@lznogood - 这个问题是否已经被标记了，因为我上次评论时可能错过了它们。

标签： jquery jquery-ui datepicker drop-down-menu

【解决方案1】：

 $('.datetime').datepicker({
     dateFormat: 'm/d/yy',
     beforeShow: function (input, inst) {
         var offset = $(input).offset();
         var height = $(input).height();
         window.setTimeout(function () {
             inst.dpDiv.css({ top: (offset.top + height + 4) + 'px', left: offset.left + 'px' })
         }, 1);
     }

 });

【讨论】：

对于那些想了解其背后逻辑的人check this

【解决方案2】：

在此post 中寻找解决方案。这是你要找的吗？

【讨论】：

@Shivik：哪个命令更好，可以让我的日期选择器显示：从下到右？
@klox - 您使用的是哪个 jquery datepicker？您使用的是 jquery-ui 日期选择器 (jqueryui.com/demos/datepicker) 还是其他的？
@klox - 你的意思是 datepicker 显示在文本框上方而不是下方，就像这里一样 (jqueryui.com/demos/datepicker)。你能张贴一张它的样子吗？
@Shivik:我已经上传图片了
@klox：尝试将日期选择器放在表单上的不同位置。就像不是在顶部，而是介于两者之间。没见过这样的案例，只能试试。

【解决方案3】：

扩展伊戈尔的答案。要将日历定位到 datepicker 输入元素的右下角，请使用：

$('.datepicker').datepicker({
    beforeShow: function (input, inst) {
        var offset = $(input).offset();
        window.setTimeout(function () {
            var calWidth = inst.dpDiv.width();
            var inpWidth = $(input).width() + parseInt($(input).css('padding'));
            inst.dpDiv.css({ left: offset.left + (inpWidth - calWidth) + 'px' })
        }, 1);
    }
});

【讨论】：