javascript - eonasdan bootstrap:无法使用小时箭头图标增加小时数
问题描述
我通过在项目中导入这个 JS 文件来使用Eonasdan datetimepicker 版本:4.17.47。
此外,我正在使用一些自定义验证来确保当用户输入与预期不同的时间范围时显示红色文本。我没有设置minDate
或maxDate
因为时间范围是动态的并且可以更改。
但有时,用户无法通过单击向上箭头键来增加小时/分钟。datetimepicker
设置为仅使用时间,因此初始化为:
$("#timePicker").datetimepicker({
format: "LT",
allowInputToggle: true,
keepInvalid: true // the up arrow icon was not working, so I thought this will fix it but it didn't
});
和模板:
<div class="form-group col-sm-6 time-block">
<div class="control input-group customtextInput" id="timePicker">
<input type="text" id="stime" name="time" class="inputText col-md-12 form-control time-picker"
data-bind="event:{ blur: function (data, event) {$parent.handleDateTimeOnblur.bind(data, $parent, event)() } }"
required />
<span class="input-group-addon">
...
</span>
</div>
<p class="text-danger login-error-msg time-empty" id="time-error" aria-label="Error Message"
data-bind="text: $parent.timeErrorMessage()" role="alert"></p>
</div>
你可以在这里看到一个演示
我注意到,当用户尝试使用 datetimepicker 转到下一个日期时,它会停止递增,(此给定页面上的日期选择器未连接,它们是单独初始化的。)
对此的任何帮助将不胜感激!
解决方案
这个问题我们现在解决了。参见GitHub 上的讨论
推荐阅读
- java - 将 OpenJDK 版本从 11.0.2 更新到 11.0.10 时发生类转换异常
- reactjs - 在 React MUI DataGrid 中的复选框选择上获取行项目
- python - 当应用程序的属性(例如:'类名')将来发生变化时,如何正确处理 Selenium Xpath
- css - 如何防止 CSS 动画移动我页面的其余部分?
- php - 使用 TCPDF 库创建 PDF 失败
- vue.js - Vuetify 对话框和带有选择输入的视觉错误
- android - Android:如何在一个 TextView 中组合文本和图标
- flutter - Flutter Provider select - 如何处理复杂的返回类型,如 List 或 Map
- javascript - 添加 xml 缓冲区以形成数据
- mongodb - 从 mongodb 获取数据时如何设置默认值