2016-09-23 92 views
0

當用戶單擊輸入字段時,我已經成功添加了引導日期選擇器。我想展示一些具體的數據,當鼠標懸停在引導日期選擇器上,因爲airbnb是可能的嗎?Bootstrap Datepicker顯示彈出日期

enter image description here

編輯

Here is my fiddle

HTML

<input type="text" name="start_date" id="date-from" placeholder="Check-in"> 

JS

$(document).ready(function(){ 
    //Date Pickers - Main Page 
    var nowTemp = new Date(); 
    var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0); 
    var checkin = $('#date-from').datepicker({ 
    format: 'dd/mm/yyyy', 
    startDate: '+1d', 
    weekStart: 1, 


    beforeShowDay: function (date) { 
     return date.valueOf() >= now.valueOf(); 
    }, 
    autoclose: true 

    }).on('changeDate', function (ev) { 

}); 







}); 

回答

3

這裏是我已更新顯示popover的JSFiddle。

https://jsfiddle.net/mr3dxj5p/4/

$('body').on({ 
    mouseenter: function() { 
     $(this).popover({ 
     content: '$' + parseInt($(this).text()) * 100, 
     placement: 'top', 
     container: '.datepicker', 
     title: 'Price' 
     }).popover('show'); 
    }, 
    mouseleave: function() { 
     $(this).popover('hide') 
    } 
    }, '.datepicker .day:not(.disabled)'); 
+0

我可以把一個數組的內容?圖片我想每天都顯示不同的價格。我怎樣才能做到這一點?我每天都會從數據庫中獲得價格。 –

相關問題