Javascript bootstrap 4 的 bootstrap-datetimepicker
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/47618134/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
bootstrap-datetimepicker for bootstrap 4
提问by HamedFathi
I want to use bootstrap-datetimepickerwith bootstrap 4 but I have some problems.
我想在bootstrap 4 中使用bootstrap-datetimepicker,但我有一些问题。
For this purpose I changed something like:
为此,我更改了以下内容:
pull-righttofloat-righttable-condensedtotable-smglyphiconstofontawesome
pull-right到float-righttable-condensed到table-smglyphicons到fontawesome
but it did not work :(
但它没有用:(
Can anyone help me for converting this project to new bootstrap version?
任何人都可以帮助我将此项目转换为新的引导程序版本吗?
采纳答案by Mayeenul Islam
We've made a fork with the fixes with detail documentation:
我们已经使用详细文档进行了修复:
Forked Repository:
分叉存储库:
Usage:
用法:
jQuery(document).ready(function($) {
if (window.jQuery().datetimepicker) {
$('.datetimepicker').datetimepicker({
// Formats
// follow MomentJS docs: https://momentjs.com/docs/#/displaying/format/
format: 'DD-MM-YYYY hh:mm A',
// Your Icons
// as Bootstrap 4 is not using Glyphicons anymore
icons: {
time: 'fa fa-clock-o',
date: 'fa fa-calendar',
up: 'fa fa-chevron-up',
down: 'fa fa-chevron-down',
previous: 'fa fa-chevron-left',
next: 'fa fa-chevron-right',
today: 'fa fa-check',
clear: 'fa fa-trash',
close: 'fa fa-times'
}
});
}
});
Credits:
学分:
Thanks to Eonasdanfor the awesome library. Thanks to 非良 (wgbbiao) for their fork too. Thanks to Camille Anelli's blogfor the reminder about the icons.
感谢Eonasdan提供了很棒的图书馆。也感谢非良 ( wgbbiao) 的叉子。感谢Camille Anelli 的博客对图标的提醒。
回答by Stéphanie Caumont
回答by AlexGM
@Stéphanie your demo more than made up for the short English explanation. Thanks!
@Stéphanie 您的演示足以弥补简短的英文解释。谢谢!
For anyone else that might need to solve this, here go a very specific directions: (All based on @Stéphanie's answer below - checkout her demo.) There are four strings you need to search in the code:
对于可能需要解决此问题的其他任何人,这里有一个非常具体的说明:(全部基于下面@Stéphanie 的回答 - 查看她的演示。)您需要在代码中搜索四个字符串:
"collapse in":"
g=f.find(".in")
.collapse:not(.in)
(g.removeClass("in"),h.addClass("in")
"折叠入":"
g=f.find(".in")
.collapse:not(.in)
(g.removeClass("in"),h.addClass("in")
and in each case replace in with; show so that it will look like the following. Save the file and the calendar should work. Good luck!
并且在每种情况下取代 在 与; 显示 ,使其看起来如下所示。保存文件,日历应该可以工作。祝你好运!
"collapse show":"
g=f.find(".show")
.collapse:not(.show)
(g.removeClass("show"),h.addClass("show")
"折叠显示":"
g=f.find(".show")
.collapse:not(.show)
(g.removeClass("show"),h.addClass("show")

