19
<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> 

所以這裏是我的datepicker看起來像。所以基本上當我通過點擊鼠標改變日期時,它的效果很好,但是當我用鍵盤手動更改日期或手動清除日期更改日期事件不會被調用時。這是一個錯誤還是我在這裏做錯了什麼?引導日期選擇器更改日期事件不會觸發手動編輯日期或清除日期

回答

29

如果您想響應手動輸入,您必須在輸入本身上使用change事件,因爲changeDate事件僅適用於使用日期選擇器更改日期的情況。

嘗試這樣:

$(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("-"); 
    } 
} 
+0

你能舉個例子嗎? – Marijus

+4

'.change(...)。on('changeDate')'導致雙擊。 –

+2

而不是'changeDate'嘗試'dp.change',爲我工作 – Sritam

0

這應該讓它在這兩種情況下工作

function onDateChange() { 
    // Do something here 
} 

$('#dpd1').bind('changeDate', onDateChange); 
$('#dpd1').bind('input', onDateChange); 
7

在版本2.1.5

CHANGEDATE更新的引導V3已更名爲change.dp所以CHANGEDATE不是爲我工作

$("#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」

它給了我很艱難的時期:)

+8

從版本4.7.14開始,正確的事件引用是「dp」。更改「 – RogerDodge

3

試試這個可能是有人有幫助:

$(".datepicker").on("dp.change", function(e) { 
    alert('hey'); 
}); 
+2

也描述你的解決方案,所以它會清楚你在代碼中試圖做什麼和爲什麼。 –

+2

請解釋你的答案。 – Dropout

2

新版本已經改變..最新的版本使用下面的代碼:

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

我找到了一個簡短的解決方案。 不需要額外的代碼,只需觸發changeDate事件。例如。 $('.datepicker').datepicker().trigger('changeDate');

相關問題