不起作用 jquery ui datetimepicker (node.js + ejs + express)

我正在尝试使用这个：http://trentrichardson.com/examples/timepicker/

这是我的代码：

<html>
<head>
    <script src="http://trentrichardson.com/examples/timepicker/js/jquery-1.7.1.min.js">     </script>
    <script src="http://trentrichardson.com/examples/timepicker/js/jquery-ui-1.8.16.custom.min.js"></script>
    <script src="http://trentrichardson.com/examples/timepicker/js/jquery-ui-sliderAccess.js"></script>
    <script src="http://trentrichardson.com/examples/timepicker/js/jquery-ui-timepicker-addon.js"></script>
    <link type="text/css" href="http://trentrichardson.com/examples/timepicker/css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="stylesheet">   
<script>
$(function() {
  $('#dateTimePicker1').datetimepicker();
});
</script>
</head>
<body>
    <%-body%>      
</body>
</html>

这就是正文.ejs：

<input id="dateTimePicker1" class="hasDatepicker"></input>

我得到的是一个简单的输入。当我单击它时，没有任何反应。我在控制台中没有收到任何错误。我需要帮助解决这个问题。

更新（我有一个路由文件）：

exports.index = function(req, res){
  res.render('index', { title: 'index' })
};

我检查了，页面加载后输入在代码中。

但是，奇怪的是：我使用作者的插件打开网站（本文中的第一个链接）。打开开发人员工具。编辑站点的 HTML - 在示例输入附近添加新输入。名称（和 ID）它示例222。在控制台中执行

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

他的输入有效，我的不行！那是什么巫术？:)

首先，我认为您的脚本是在加载 DOM 之前执行的，这是错误的，因为它包装在 $（...）中，并且应该表现得像包装在 $.ready（...）中一样。

如果您没有收到任何错误，则意味着代码找不到与选择器匹配的任何 DOM 元素，这意味着您的模板未应用。

您能否检查一下您的源代码（在浏览器中）是否具有<input id="dateTimePicker1" class="hasDatepicker"></input>或仍然包含 ejs 模板。

然后，您能否向我们展示如何在node.js中调用渲染。

编辑：问题是jQuery代码没有执行。

这将按照这个jsFiddle所证明的那样工作：

<html>
    <head>
        <script src="http://trentrichardson.com/examples/timepicker/js/jquery-1.7.1.min.js">     </script>
        <script src="http://trentrichardson.com/examples/timepicker/js/jquery-ui-1.8.16.custom.min.js"></script>
        <script src="http://trentrichardson.com/examples/timepicker/js/jquery-ui-sliderAccess.js"></script>
        <script src="http://trentrichardson.com/examples/timepicker/js/jquery-ui-timepicker-addon.js"></script>
        <link type="text/css" href="http://trentrichardson.com/examples/timepicker/css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="stylesheet">
    </head>
    <body>
        <input id="dateTimePicker"></input>  
        <script type="text/javascript">
            $(document).ready(function() {
                $('#dateTimePicker').datetimepicker();
            });
        </script> 
    </body>
</html>

相关内容

最新更新

热门标签：