使用jQuery UI datepicker在新行上显示Previous和Next按钮

时间:2011-02-17 16:44:54

标签: jquery jquery-ui datepicker

在Opera 11,Firefox 3.6.13和IE 8中都会发生这种情况。在我创建的所有日期选择器上,我们创建了上一个和下一个按钮,这些按钮在月份和年份之上显示在他们自己的行上。这种情况发生在我的自定义滚动主题中,并使用我刚下载的UI Lightness并且没有添加自定义CSS。我正在使用jQuery UI版本1.8.9和jQuery 1.4.3。我已经使用UI 1.8.7和jQuery 1.4.4在jsFiddle上重现了它。

JS Fiddle Example

我的代码:

$(document).ready(function() {
    var dates = $('.date').datepicker();
});

HTML:

<html>
    <head>
    </head>
    <body class="ui-widget">
        <div id='mainApplication' class="ui-widget">
            <div id="menuBar" class="ui-widget">
                <br />
                <span><strong>Start Date:</strong></span><br>
                <input type="text" id="start" class="date"><br>
                <span><strong>End Date:</strong></span><br>   
                <input type="text" id="end" class="date"><br>
            </div>
        </div>
    </body>
</html>

1 个答案:

答案 0 :(得分:2)

看起来像是一个CSS问题。如果你比较demo example的css(使用firebug)和你所写的内容,你会发现css是不同的。如果您通过“添加资源”通过URL添加css文件“http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/themes/base/jquery-ui.css”,您将获得正确的布局