为什么我的 Bootstrap 日期时间选择器不工作?
Why is my Bootstrap datetimepicker not working?
您好,我已将 bootstrap datetimepicker
添加到我的网站,但它似乎无法正常工作。
我错过了什么吗?还是做错了什么?请 help.The 控件处于 bootstrap 模式,但据我所知,它不会限制您的可访问性,这是我能想到它不起作用的唯一原因...
这是我的参考资料:
<link rel="stylesheet" href="css/bootstrap.css" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/bootstrap-select.min.css" />
<link rel="stylesheet" href="css/jquery.bootstrap-touchspin.min.css" />
<link rel="stylesheet" href="css/jquery.contextmenu.min.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/mycss.css" />
<link rel="stylesheet" href="css/bootstrap-datetimepicker.min.css" />
<script src="js/bootstrap.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-select.min.js"></script>
<script src="js/jquery.backstretch.min.js"></script>
<script src="js/jquery.bootstrap-touchspin.min.js"></script>
<script src="js/jquery.contextmenu.min.js"></script>
<script src="Scripts/bootstrap-datetimepicker.min.js"></script>
这是我的控件:
<div class="row" id="div9" runat="server">
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6" style="margin-top: 5px">
<asp:Label ID="Label14" runat="server" Text="Start Date" CssClass="form-control" Font-Bold="true" ForeColor="Black" Font-Size="14px"></asp:Label>
</div>
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<asp:TextBox ID="txt_start_date" runat="server" CssClass="form-control" TextMode="SingleLine" Width="100%" ForeColor="Black" Font-Bold="True"></asp:TextBox>
</div>
</div>
这是我的脚本:
<script type="text/javascript">
$(function () {
$('#txt_start_date').datetimepicker({ format: 'YYYY-MM-DD', useCurrent: true });
});
});
</script>
尝试此代码,无需使用 Jquery。使用输入类型日期而不是文本。
<input type="date" class="form-control"/>
Bootstrap 4 不支持日期时间选择器。
更改文件 bootstrap-datetimepicker.min.js
'collapse in'
expanded = $parent.find('.in'),
closed = $parent.find('.collapse:not(.in)'),
expanded.removeClass('in');
closed.addClass('in');
至
'collapse show'
expanded = $parent.find('.show'),
closed = $parent.find('.collapse:not(.show)'),
expanded.removeClass('show');
closed.addClass('show');
您好,我已将 bootstrap datetimepicker
添加到我的网站,但它似乎无法正常工作。
我错过了什么吗?还是做错了什么?请 help.The 控件处于 bootstrap 模式,但据我所知,它不会限制您的可访问性,这是我能想到它不起作用的唯一原因...
这是我的参考资料:
<link rel="stylesheet" href="css/bootstrap.css" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/bootstrap-select.min.css" />
<link rel="stylesheet" href="css/jquery.bootstrap-touchspin.min.css" />
<link rel="stylesheet" href="css/jquery.contextmenu.min.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/mycss.css" />
<link rel="stylesheet" href="css/bootstrap-datetimepicker.min.css" />
<script src="js/bootstrap.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-select.min.js"></script>
<script src="js/jquery.backstretch.min.js"></script>
<script src="js/jquery.bootstrap-touchspin.min.js"></script>
<script src="js/jquery.contextmenu.min.js"></script>
<script src="Scripts/bootstrap-datetimepicker.min.js"></script>
这是我的控件:
<div class="row" id="div9" runat="server">
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6" style="margin-top: 5px">
<asp:Label ID="Label14" runat="server" Text="Start Date" CssClass="form-control" Font-Bold="true" ForeColor="Black" Font-Size="14px"></asp:Label>
</div>
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<asp:TextBox ID="txt_start_date" runat="server" CssClass="form-control" TextMode="SingleLine" Width="100%" ForeColor="Black" Font-Bold="True"></asp:TextBox>
</div>
</div>
这是我的脚本:
<script type="text/javascript">
$(function () {
$('#txt_start_date').datetimepicker({ format: 'YYYY-MM-DD', useCurrent: true });
});
});
</script>
尝试此代码,无需使用 Jquery。使用输入类型日期而不是文本。
<input type="date" class="form-control"/>
Bootstrap 4 不支持日期时间选择器。 更改文件 bootstrap-datetimepicker.min.js
'collapse in'
expanded = $parent.find('.in'),
closed = $parent.find('.collapse:not(.in)'),
expanded.removeClass('in');
closed.addClass('in');
至
'collapse show'
expanded = $parent.find('.show'),
closed = $parent.find('.collapse:not(.show)'),
expanded.removeClass('show');
closed.addClass('show');