问题描述
我正在尝试在 jade/pug 中创建一个日期/时间选择器，类似于此链接中的第一个示例： : 。 我正在使用 Node/express js 服务器端。 当我点击 glyphicon-calendar 图标时，日历不会出现。 我已经安装了以下软件包：npm i bootstrap-datetimepicker-npm
到目前为止，我已经尝试了以下代码：
block console_content .sensor-page(ng-controller="ambientCtrl") h1 Sensors // Date-Time Widget div(class="container") div(class="row") div(class="col-sm-6") div(class="form-group") div(class='input-group date' id='datetimepicker1') input(type='text' class="form-control") span(class="input-group-addon") span.glyphicon.glyphicon-calendar script(type="text/javascript"). $( document ).ready(function () {$('#datetimepicker1').datetimepicker()}); // Sensor Checkbox Widget p {{selection}} label(ng-repeat='sensorName in sensors') input(type='checkbox', name='selectedSenors[]', value='{{sensorName}}', ng-checked='selection.indexOf(sensorName) > -1', ng-click='toggleSelection(sensorName)') | {{sensorName}} button(ng-click="changeSensors()") Show canvas(id="myChart") h1 Sensor p Info about sensors here script(src='https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js') link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css') link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css') link(rel='stylesheet', href='https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css') script(src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js') script(src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js') script(src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js') script(src='https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js')
但是，这会引发错误。 我有两个问题：
上面的代码有什么问题，我该如何编辑它来模仿上面链接中的代码。
如何在 javascript 中保存选定的日期时间并将其转换为 Unix 时间戳？
1楼
更新：
原来的“未捕获”引用错误：$未定义”已通过将脚本移动到页面的开头来解决，如下所示：
block console_content .sensor-page(ng-controller="ambientCtrl") script(src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.bundle.min.js") script(type='text/javascript', src='https://cdn.jsdelivr.net/jquery/latest/jquery.min.js') script(type='text/javascript', src='https://cdn.jsdelivr.net/momentjs/latest/moment.min.js') script(type='text/javascript', src='https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js') link(rel='stylesheet', type='text/css', href='https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css') h1 Sensors // Date-Time Widget div(class="container") div(class="row") div(class="col-sm-6") div(class="form-group") div(class='input-group date' id='datetimepicker1') input(type='text' class="form-control") span(class="input-group-addon") span.glyphicon.glyphicon-calendar script(type="text/javascript"). $( document ).ready(function () {$('#datetimepicker1').datetimepicker()}); // Sensor Checkbox Widget p {{selection}} label(ng-repeat='sensorName in sensors') input(type='checkbox', name='selectedSenors[]', value='{{sensorName}}', ng-checked='selection.indexOf(sensorName) > -1', ng-click='toggleSelection(sensorName)') | {{sensorName}} button(ng-click="changeSensors()") Show canvas(id="myChart") h1 Sensor p Info about sensors here
但是，这会导致新错误“jQuery.Deferred 异常：$(...).datetimepicker 不是函数 TypeError：$(...).datetimepicker 不是函数”
2楼
甚至我也面临同样的错误。 我尝试通过在顶部声明 jquery 和 bootstrap 然后其他链接。