我在這裏使用JQuery UI Datepicker:https://jqueryui.com/datepicker/。這是我實現的樣子:JQuery UI日期選取器css看起來很有問題
包括。在我的頭:
<!-- JQuery -->
<script src="http://cdn.jsdelivr.net/webjars/jquery/2.1.4/jquery.min.js"></script>
<!-- Bootstrap CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<!-- Include Single Date Picker -->
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" />
<script src="http://cdn.rawgit.com/jquery/jquery-ui/1.10.4/ui/jquery.ui.datepicker.js"></script>
<script id="mobile-datepicker" src="http://cdn.rawgit.com/arschmitz/jquery-mobile-datepicker-wrapper/v0.1.1/jquery.mobile.datepicker.js"></script>
HTML。我有兩個日期選擇了在同一時間:
<!-- Include Single Date Picker -->
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<td><input th:field="*{dateFrom}" style="border-radius: 4px; padding: 11px 11px 11px 11px; width: 100%;" type="text" class="datepicker" /></td>
<td><input th:field="*{dateTo}" style="border-radius: 4px; padding: 11px 11px 11px 11px; width: 100%;" type="text" class="datepicker" /></td>
的JavaScript。在我的頁面的底部:
<!-- Initialize Date Picker -->
<script type="text/javascript">
$(function() {
$(".datepicker").datepicker();
});
</script>
爲什麼我的日曆看起來那麼糟糕?
這是一些CSS。你能提供一個jsfiddle嗎?我會糾正它。 – Sandwell
@Sandwell我在這裏開始了一個:https://jsfiddle.net/#&togetherjs=mmRTK5zow3 – santafebound