jquery - Jquery DateTimePicker 不可见

Question

我正在尝试将此http://trentrichardson.com/examples/timepicker/实施到我的项目中。

问题是什么都没有发生。

所以，这是我已经完成但没有删除的内容：

-我已经下载了 .js 文件并将其放入“脚本”文件中。-我以这种方式添加了对该脚本的引用：

<script src="@Url.Content("~/Scripts/jquery-ui-timepicker-addon.js")" type="text/javascript"></script>

我在页面的开头添加了这个：

 <script type="text/javascript">
$(function () {
    $('.datetime').datetimepicker();
});
 </script>

我在 css 文件的末尾添加了这个：

 /* css for timepicker */
 .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
 .ui-timepicker-div dl { text-align: left; }
 .ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
 .ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
 .ui-timepicker-div td { font-size: 90%; }
 .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

我也有这个：

 <input type="text" class="datetime" id="datetime1" value="" />

问题是只有显示的文本框。时间选择器不是。我有什么不明白的？

Answer 1

在这里你也可以为你演示：http: //jsfiddle.net/atP2P/

HTML

上课不见了

<script src="http://trentrichardson.com/examples/timepicker/js/jquery-ui-timepicker-addon.js" type="text/javascript"></script>

<input type="text" name="datetime" id="datetime1" class="datetime" value="" />
​

Answer 2

您.datetime在初始化插件时正在使用类。所以你的 HTML 应该有类

 <input type="text" name="datetime" id="datetime1" class="datetime" value="" />

演示

或者，您可以初始化您的插件以选择id而不是类，例如：

$(function () {
    $('#datetime1').datetimepicker();
});

无论哪种方式，它都会起作用。

Answer 3

你必须改变这个

 <input type="text" name="datetime" id="datetime1" value="" />

对此

 <input type="text" name="datetime" class ="datetime" id="datetime1" value="" />

由于您使用 css 类选择器来选择 dom 元素，因此您必须指定该元素的类属性，以便 dateimepicker 可以找到带有 class="datetime" 的控件

或者，如果您不想在输入元素上使用 css 类，也可以选择使用 id 选择器更改脚本

$(function () {
    $('#datetime1').datetimepicker();
});

这将使您对 jquery 和选择器有一个很好的了解

Answer 4

或者你可以改变

$('.datetime').datetimepicker();

至

$('#datetime1').datetimepicker();

如果你真的想使用类，试试这个：

$('.datetime').each(function() {
    $(this).datetimepicker();
});

Answer 5

尝试将文本框的类属性添加为“日期时间”