我使用datepicker从此网站https://eonasdan.github.io/bootstrap-datetimepicker/
进行引导当输入为空时,我尝试捕获从开头点击的日期点击。 dp.change的问题是当我点击日历图标时捕获了第一个点击事件。 如果我点击td.day它就会工作。
$(document).ready(function(){
$(function () {
$('#datetimepicker').datetimepicker({
format:'YYYY-MM-DD',
locale: 'en'
});
});
$(".datepicker .datepicker-days td.day").click(function(){
alert('day clicked');
});
$("#datetimepicker").on("dp.change", function() {
alert('calendar icon clicked');
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<div class="input-group date reload_element" id="datetimepicker">
<span class="input-group-addon reload_element cursor-pointer">
<i class="fa fa-calendar"></i>
</span>
<input type="text" id="start_date" class="form-control reload_element" style="width:100px;" autocomplete="off"/>
</div>
&#13;
答案 0 :(得分:1)
我迟到了,我没有解决方案,但我知道为什么你的代码不起作用。
日历的结构是在每次显示时生成和删除的,由于这个听众在开始时被删除并丢失了效果,你应该在日历再次生成的时刻附加听众。
也许您想要的解决方案是这样的:警告代码未经过测试。
$(document).ready(function(){
$(function () {
$('#datetimepicker').datetimepicker({
format:'YYYY-MM-DD',
locale: 'en'
});
var cont = 0;
$('.reload_element').on("dp.show",function(e){
$('td.day').on("click",function(e){
$('#response').text('day clicked '+cont);
});
++cont;
return true;
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<div class="input-group date reload_element" id="datetimepicker">
<span class="input-group-addon reload_element cursor-pointer">
<i class="fa fa-calendar"></i>
</span>
<input type="text" id="start_date" class="form-control reload_element" style="width:100px;" autocomplete="off"/>
</div><span id="response"></span>
答案 1 :(得分:1)
$('.scheduleDate').datepicker({
format: 'dd/M/yyyy',
}).on('changeDate', function(e) {
console.log(e.format());
});
答案 2 :(得分:0)
这不是一个答案,但我是因为代码格式化而添加的。加载页面时,如果您检查div
。
这是live
元素,因此请使用jQuery
on
函数:
$(".datepicker .datepicker-days").on('click', 'td.day', function () {
alert('day clicked');
});
答案 3 :(得分:0)
System.Configuration.Configuration config = ConfigurationManager.OpenExeConfiguration(ConfigurationUserLevel.None);
ConfigurationSectionGroupCollection sectionGroups = config.SectionGroups;
foreach (ConfigurationSectionGroup group in sectionGroups)
// Loop over all groups
{
Console.WriteLine(group);
if (group.Name == "FileCheckerConfigGroup")
{
foreach (ConfigurationSection configurationSection in group.Sections)
{
var section = ConfigurationManager.GetSection(configurationSection.SectionInformation.SectionName) as NameValueCollection;
}
}
}
使用onClose事件获取日期
答案 4 :(得分:0)
我已经使用这种方法获取点击事件
$("#datetimepicker").on("dp.show", function (e) {
$('div tbody').on('click', 'tr > .day', function () {
alert('day clicked');
})
});