jQuery中的DatePicker今天按鈕不起作用

轉載：http://codego.net/63433/

jquery-ui 日期選擇器datepicker
我想用 jQueryUI 的 DatePicker ，並顯示“今天”按鈕， 但它不工作，它也不會在演示工作： 我想補今天的輸入時，按下此按鈕。 是否有可能得到它的工作？
------------------------------------------------------------------------------------------------------------------------- 
1. 他們的代碼是不是真的壞了。它只是沒有做什么，大多數人會想到它做的。這是今天的日期，進入輸入框。它所做的，就是亮點，看看在日歷上今天的日期。如果他們離開，再過一個月或一年，日歷彈出回到今天的視圖 CodeGo.net，而無需取消已選定的日期。 為了使它更加直觀，你需要更新插件代碼，以滿足您的需求。知道如何去。 你需要得到的jQuery UI的JavaScript的版本。我期待在1.7.2版本和“_gotoToday”函數上線6760。只需添加一個調用到該_gotoToday是激發了上線6831的_selectDate（）函數。 :)快樂編碼。 

2. 我不喜歡修改它消除能力的CDN jQuery的源代碼的解決方案。相反，你可以通過在你的頁面的范圍的JavaScript文件的代碼（基於@meesterjeeves接聽）重新分配_gotoToday函數：

$.datepicker._gotoToday = function(id) {
 var target = $(id);
 var inst = this._getInst(target[0]);
 if (this._get(inst, 'gotoCurrent') && inst.currentDay) {
   inst.selectedDay = inst.currentDay;
   inst.drawMonth = inst.selectedMonth = inst.currentMonth;
   inst.drawYear = inst.selectedYear = inst.currentYear;
 }
 else {
   var date = new Date();
   inst.selectedDay = date.getDate();
   inst.drawMonth = inst.selectedMonth = date.getMonth();
   inst.drawYear = inst.selectedYear = date.getFullYear();
   // the below two lines are new
   this._setDateDatepicker(target, date);
   this._selectDate(id, this._getDateDatepicker(target));
 }
 this._notifyChange(inst);
 this._adjustDate(target);
}

上面的代碼基本上是從1.10.1版本的jQuery UI的DatePicker，除了上面標有兩行。整個喃喃巨無霸與gotoCurrent因為該選項是沒有意義的與我們的“今天”，其實是可以去掉。 

3. 就在下面的兩行代碼添加到_gotoToday函數...

/* Action for current link. */
_gotoToday: function(id) {
 var target = $(id);
 var inst = this._getInst(target[0]);
 if (this._get(inst, 'gotoCurrent') && inst.currentDay) {
  inst.selectedDay = inst.currentDay;
 inst.drawMonth = inst.selectedMonth = inst.currentMonth;
 inst.drawYear = inst.selectedYear = inst.currentYear;
 }
 else {
  var date = new Date();
  inst.selectedDay = date.getDate();
  inst.drawMonth = inst.selectedMonth = date.getMonth();
  inst.drawYear = inst.selectedYear = date.getFullYear();
 }
 this._notifyChange(inst);
 this._adjustDate(target);
 /* ### CUSTOMIZATION: Actually select the current date, don't just show it ### */
 this._setDateDatepicker(target, new Date());
 this._selectDate(id, this._getDateDatepicker(target));
},

4. 雖然我知道這已經被接受，這是我擴展的解決方案基於薩米鋅的想法。這個jQuery 1.6.3和jQuery UI 1.8.16，並且工作在Firefox 6。

$('.ui-datepicker-current').live('click', function() {
 // extract the unique ID assigned to the text input the datepicker is for
 // from the onclick attribute of the button
 var associatedInputSelector = $(this).attr('onclick').replace(/^.*'(#[^']+)'.*/gi, '$1');
 // set the date for that input to today's date
 var $associatedInput = $(associatedInputSelector).datepicker("setDate", new Date());
 // (optional) close the datepicker once done
 $associatedInput.datepicker("hide");
});

你不妨也blur()該$associatedInput並在接下來的輸入/在你的頁面中選擇，但是這不是容易做到籠統，或者是 作為一個例子，我做了這一個頁面我工作表的布局上（不要開始，我知道這是不好的做法！）：

$associatedInput.closest('tr').next('tr').find('input,select').first().focus();

5. 我認為處理這一點的最好辦法是重寫庫本身的外側。這解決的問題

var old_goToToday = $.datepicker._gotoToday
$.datepicker._gotoToday = function(id) {
 old_goToToday.call(this,id)
 this._selectDate(id)
}

簡單，不要求你砍了任何事件或改變任何基礎函數 

6. 我不喜歡加入額外的代碼jQuery的源代碼的想法。我不希望覆蓋_gotoToday方法，通過在底部復制粘貼其在javascript代碼並添加額外的線路。 所以，我調整了這段代碼：

(function(){
 var original_gotoToday = $.datepicker._gotoToday;
 $.datepicker._gotoToday = function(id) {
  var target = $(id),
   inst = this._getInst(target[0]);
  original_gotoToday.call(this, id);
  this._selectDate(id, this._formatDate(inst, inst.selectedDay, inst.drawMonth, inst.drawYear));
 }
})();

7. 你可以試試下面的代碼，以及填補當前日期輸入框上點擊今天按鈕。只要把下面的代碼中_gotoToday函數（在函數的末尾）中jquery.ui.datepicker.js。

this._selectDate(id, this._formatDate(inst,
inst.selectedDay, inst.drawMonth, inst.drawYear));

請注意，jQuery的日期選擇器的，我1.8.5版本。

 
8. jQuery UI的DatePicker的今天鏈接$('button.ui-datepicker-current').live('click', function() { $.datepicker._curInst.input.datepicker('setDate', new Date()).datepicker('hide').blur(); }); 

9. 說什么“今天”按鈕，標題可以通過改變

.datepicker('option', 'currentText', 'New Title')

唯一改變顯示的月份為電流。這種行為也可以被配置

.datepicker('option', 'gotoCurrent', true);

之后，按下按鈕，將顯示的月份更改為所選日期的之一。 這似乎提交一個日期與這個按鈕是不可能設計。 

10. 我添加了一個選項，將日期選擇器用於這一目的：selectCurrent。 做你只需要添加下面的js文件： 1）向函數的DatePicker的結束（），添加：

selectCurrent: false // True to select the date automatically when the current button is clicked

2）在_gotoToday函數的末尾，添加：

if (this._get(inst, 'selectCurrent'))
 this._selectDate(id, this._formatDate(inst, inst.selectedDay, inst.drawMonth, inst.drawYear));

11. 在日期選擇器被重構為至少10多個新版本將解決這個問題。 

12. 你也可以嘗試把它添加到你的腳本：

$('.ui-datepicker-current').live('click', function() {
  $(".datepicker").datepicker("setDate", date);
});

（使用。生活函數，而不是。點擊） 

13. 我剛擺脫它。 在CSS文件，這就是你的頁面的一部分：

.ui-datepicker-current {
 visibility:hidden
}

14. 這是曾在datepicker的beforeShow回調函數，而不是活（）方法是一個hacker。

  ,beforeShow: function(input, datepicker) {
   setTimeout(function() {
    datepicker.dpDiv.find('.ui-datepicker-current')
    .text('Select Today')
    .click(function() {
      $(input)
       .datepicker('setDate', new Date())
       .datepicker('hide');
    });
   }, 1);
   return {};
  }