如何让jQuery UI Datepicker显示在输入字段的左侧？

Question

我正在使用的项目使用IE8，框架和绝对定位。其中一个框架太小，但由于项目要求，我无法改变尺寸。我已经包含了jQuery UI日期选择器，但它直接出现在字段上（上面或下面没有空间显示）。

我想改为将datepicker显示在输入的左侧。有什么办法可以做到这一点？我已经在测试页面中尝试过这段代码，但仍然无法从下面改变位置。

 $(".date").datepicker({ 
     changeYear: true, 
     dateFormat: 'mm/dd/yy', 
     constrainInput: true, 
     yearRange: 'c-125:c+125', 
     showAnim: "", 
     showOptions: { direction: "up" } 
     }); 

Answer 1

将日期时间选择器包装成带有一些id的div/span/p。应用方向属性在CSS的DIV >>

为前：

HTML代码：

<div id="dtPicker">Date: 
    <input type="text" id="datepicker"/> 
</div> 

CSS：

div#dtPicker { 
    direction: rtl; 
} 

JS：

$("#datepicker").datepicker({ 
    showOn: "button", 
    buttonImage: "../../icon.png", 
    buttonImageOnly: true 
}); 

该图标应显示在输入栏的左侧。 :)

或者在您的自定义CSS中，您可以覆盖图像的jQuery UI CSS。

.ui-datepicker-trigger { 
    float: left; 
} 

Answer 2

可以使用的日期选择器类似isRTL属性：

$('#datepicker').datepicker({ 
    isRTL: true, 
    ... 
}); 

的更多信息，可以发现@http://api.jqueryui.com/datepicker/#option-isRTL