Austin's Note

使用法方：

<input type="hidden" id="t1" name="t1" value="2009-01-01 00:00:00" />
<script language="javascript">
$('#t1').datetime({
    dateFormat: "yy-mm-dd",
    defaultDate: $(this).val(),
    changeMonth: true,
    changeYear: true,
});
</script>

Plugin的程式碼：

jQuery.fn.datetime = function(param) {
   if(typeof(jQuery.fn.datepicker) != 'function') {
      alert('找不到datepicker');
      return;
   }

   var padLeft = function(str,lenght){
      if(str.toString().length >= lenght)
         return str;
      else
         return padLeft("0" +str,lenght);
   }

   $all = this;
   return this.each(function() {
      var $this    = jQuery(this);
      var $chk     = jQuery('<input type="checkbox" id="chk_enable"> /');
      var $date    = jQuery('<input type="text" id="'+id+'_d" value="" />');
      var $hour    = jQuery('<select id="'+id+'_h"></select>').change(update);
      var $minute  = jQuery('<select id="'+id+'_m"></select>').change(update);

      var id       = $this.attr('name');
      var dt       = new Date($this.val());
      if(isNaN(dt.getTime())) {
         $chk.attr('checked', false);
         $date.attr('disabled', true);
         $hour.attr('disabled', true);
         $minute.attr('disabled', true);

         dt = new Date();
         if($all.index(this) == 0) {
            dt.setHours(0);
            dt.setMinutes(0);
            dt.setSeconds(0);
         } else {
            dt.setHours(23);
            dt.setMinutes(59);
            dt.setSeconds(59);
         }
         $chk.val(
            dt.getFullYear() + '-' +
            (dt.getMonth()+1) + '-' +
            dt.getDate() + ' ' +
            dt.toLocaleTimeString()
         );
      } else {
         $chk.attr('checked', 'checked');
      }

      // 更新的callback
      var update   = function() {
         $this.val(
            $date.val() + ' ' +
            $hour.val() + ':' +
            $minute.val() + ':' +
            padLeft(dt.getSeconds(), 2)
         );
      };

      // 啟用
      $chk.change(function() {
         if($(this).attr('checked')) {
            $date.attr('disabled', false);
            $hour.attr('disabled', false);
            $minute.attr('disabled', false);

            if(this.value != '') {
               $this.val(this.value);
            }
         } else {
            $date.attr('disabled', true);
            $hour.attr('disabled', true);
            $minute.attr('disabled', true);
            this.value = $this.val();
            $this.val('');
         }
      });

      // 日期
      $date.change(update)
          .datepicker(param)
          .val(
             dt.getFullYear() + '-' +
             (dt.getMonth()+1) + '-' +
             dt.getDate() )
          .css('width', '80px');

      // 時
      for(var i = 0; i < 24; i++) {
         var sel = "";
         if(i == dt.getHours()) sel = ' selected="selected"';
         $hour.append(
            '<option value="'+padLeft(i, 2)+'"'+sel+'>' +
            padLeft(i, 2) +
            '</option>'
         );
      }

      // 分
      for(var i = 0; i < 60; i++) {
         var sel = "";
         if(i == dt.getMinutes()) sel = ' selected="selected"';
         $minute.append(
            '<option value="'+padLeft(i, 2) + '"' + sel + '>' +
            padLeft(i, 2) +
            '</option>'
         );
      }

      // 加到表單內
      $this.parent()
           .append($chk)
           .append($date)
           .append($hour)
           .append($minute);
   });
};