手动编辑日期或清除日期时,bootstrap datepicker更改日期事件不会启动

Question

<script type="text/javascript">
    // When the document is ready
    $(document).ready(function () {
        $('.datepicker').datepicker({
            format: "yyyy-mm-dd",
        }).on('changeDate', function(ev){
            // do what you want here
            $(this).datepicker('hide');
        }).on('changeDate', function(ev){
            if ($('#startdate').val() != '' && $('#enddate').val() != ''){
                $('#period').text(diffInDays() + ' d.'); 
            } else {
                $('#period').text("-");
            }
        });
    });
</script>

所以这就是我的日期选择器的样子.所以基本上当我通过点击鼠标更改日期时它工作正常,但是当我用键盘手动更改日期或手动清除日期更改日期时,事件不会被调用.这是一个错误还是我在这里做错了什么？

Answer 1

change如果要响应手动输入,则必须在输入本身上使用该事件,因为该changeDate事件仅适用于使用datepicker更改日期的情况.

尝试这样的事情:

$(document).ready(function() {
    $('.datepicker').datepicker({
        format: "yyyy-mm-dd",
    })
    //Listen for the change even on the input
    .change(dateChanged)
    .on('changeDate', dateChanged);
});

function dateChanged(ev) {
    $(this).datepicker('hide');
    if ($('#startdate').val() != '' && $('#enddate').val() != '') {
        $('#period').text(diffInDays() + ' d.');
    } else {
        $('#period').text("-");
    }
}

Answer 2

在2.1.5版中

• 引导-datetimepicker.js
• http://www.eyecon.ro/bootstrap-datepicker
• 内容:
• 安德鲁罗尔斯
• 蒂亚戈德阿鲁达
• 由Jonathan Peterson @Eonasdan为Bootstrap v3更新

changeDate已重命名为change.dp,因此changeate对我不起作用

$("#datetimepicker").datetimepicker().on('change.dp', function (e) {
            FillDate(new Date());
    });

还需要将css类从datepicker更改为datepicker-input

<div id='datetimepicker' class='datepicker-input input-group controls'>
   <input id='txtStartDate' class='form-control' placeholder='Select datepicker' data-rule-required='true' data-format='MM-DD-YYYY' type='text' />
   <span class='input-group-addon'>
       <span class='icon-calendar' data-time-icon='icon-time' data-date-icon='icon-calendar'></span>
   </span>
</div>

日期格式化也适用于大写字母,如数据格式='MM-DD-YYYY'

它可能对它给我真正困难的人有帮助:)

Answer 3

新版本已更改..对于最新版本,请使用以下代码:

$('#UpToDate').datetimepicker({
        format:'MMMM DD, YYYY',
        maxDate:moment(),
        defaultDate:moment()            
    }).on('dp.change',function(e){
        console.log(e);
    });