2010-11-06 55 views
1


採摘UI日期選擇器日曆後,做工和用cluetip顯示事件。腳本正在工作,直到我改變月份(按鈕< - 或 - >)。
主要想法是將標題設置爲包含日期和懸停的元素顯示&使用提示分隔線條的文本。Cluetip不改變的UIDatePicker月

編輯:這裏是example - 希望它能幫助理解我的問題。

下面是javascript代碼:

$(document).ready(function() { 
var dates =[ // adding events 
[new Date(2010,8,01),new Date(2010,8,03),"Event1 | text | next line"] 
]; 

$('#calendar').datepicker({ 
beforeShowDay: highlightEvents, 
}); 

function highlightEvents(date) { 
for (var i = 0; i < dates.length; i++) { 
if (dates[i][0] <= date && dates[i][2] >= date) { 
return [true, 'odd', dates[i][2]]; } // odd == style 
} 

$('td.odd').cluetip({ // cluetip main function 
splitTitle: '|', 
cluetipClass: 'jtip', 
arrows: true, 
dropShadow: true, 
}); 
}); 

HTML代碼:

<div id="calendar"></div> 

提前感謝!

回答

1

感謝UberNeet後: jQuery UI Datepicker with jQuery tipsy

找到了答案。

// Because the the event `onChangeMonthYear` get's called before updating 
// the items, we'll add our code after the elements get rebuilt. We will hook 
// to the `_updateDatepicker` method in the `Datepicker`. 
// Saves the original function. 
var _updateDatepicker_o = $.datepicker._updateDatepicker; 
// Replaces the function. 
$.datepicker._updateDatepicker = function(inst){ 
    // First we call the original function from the appropiate context. 
    _updateDatepicker_o.apply(this, [inst]); 
    // No we can update the Tipsys. 
    addTipsys(inst.drawYear, inst.drawMonth+1, inst.id); 
}; 

希望這會幫助別人。