| ブログ |

【jQuery】日付入力用カレンダーをjQueryプラグイン用に移植中 のメモなど




[ sample ]






Opera8.5 ok
Firefox 2.0.0.9 ok
ie 6 ok
Safari 3.0.3 ok


[ update ]

2007-11-12-2 今日class="today" と今月 class="curr-m" を追加
今日の日付と今月をCSSで修飾できます。
#ほげほげ .trdate .curr-m { 
    background-color : #eee;
}

#ほげほげ .trdate .today {
    background-color : pink;
}

2007-11-12-1 日付フォーマットの指定方法
2007-11-11 日付フォーマットの変換を今までのcase文から、replace文に変更。 これで劇的にフレキシブルになります。

今までは、次のような指定方法で、内部の日付のフォーマットパターンはcase文で実装しており、 あらかじめ決まった数種類しか使えませんでしたが、、、
Old type 今までの変換

wrtCalendarLay(this,event,'mm月dd日')       →8月3日
wrtCalendarLay(this,event,'yyyy/mm/dd[曜]') →2007/8/3[金]
wrtCalendarLay(this,event,'mm/dd')          →8/3

        'yyyy' → 2005 
        'yyyy/mm' → 2005/3 
        'yyyy/mm/dd' → 2002/2/19 
        'mm/dd' → 12/24 
        'mm' → 3 
        'dd' → 31 
        'yyyy/mm/dd[曜]' → 2002/6/4 [火] 
        'yyyy/mm/dd(曜)' → 2002/6/4 (火) 
        'yyyy年mm月dd日(曜)'→ 2002年2月19日(火) 
        'mm月dd日' → 1月1日 
        'mm月dd日(曜)' → 1月1日(木) 
今度は、フォーマット用の文字列だけをreplaceするので、 文章へ埋め込むことさえできて、フォーマット形式は自由自在です。
New Type 今度の変換

  $("ほげ").起動メソッド('MM月DD日')        →08月03日
  $("ほげ").起動メソッド('M月D日')          →8月3日
  $("ほげ").起動メソッド('YYYY/MM/DD[W]')   →2007/08/03[金]
  $("ほげ").起動メソッド('YYYY/M/D[W]')     →2007/8/3[金]
  $("ほげ").起動メソッド('MM/DD')           →08/03


        'YYYY' → 2008 //4桁
        'YYY'  → 008  //下3桁
        'YY'   → 08   //下2桁
        'Y'    → 8    //下1桁

        'MM'   → 03   //0埋め2桁
        'MM'   → 12   //2桁ならそのまま
        'M'    → 3 
        'M'    → 12 
        'DD'   → 02   //0埋め2桁
        'DD'   → 11   //2桁ならそのまま
        'D'    → 2 
        'D'    → 11 

        'YYYY/MM'    → 2005/03 
        'YYYY-MM-DD' → 2002-02-19 
        'YYYY/M/D'   → 2002/2/19 
        'MM/DD'      → 12/01 
        'M/D'        → 12/1 

        'YYYY/MM/DD[W]'     → 2002/06/04 [火] 
        'YYYY/M/D(W)'       → 2002/6/4 (火) 
        'YYYY年MM月DD日(W)' → 2002年02月19日(火) 
        'MM月DD日'          → 01月01日 
        'M月D日(W)'         → 1月1日(木) 

         // フォーマット形式は自由です

         'date : M月D日(W)'                  → date : 1月1日(木) 
         'id:30000-YYYYMMDD-00'              → id:30000-20070812-00
         'YYYY年M月のD日はW曜日でござるよ。' → 2007年8月の3日は金曜日でござるよ。

         // 日付以外で、Y,M,D,W,h,n,s の文字を使うときは
         // \\Yや\\Wなど(ダブルバックスペース「\\」)でエスケープします

         'TI\\ME:YYYYMMDD'                   →TIME:20070803
         '\\hello \\World : YYYY/MM/DD'      →hello World : 2007/08/03

         // 時分秒は、カレンダーの日付クリックでは デフォルトで 0 が返ります

         "YYYY-MM-DD hh:mm:ss"               → 2002-02-19 00:00:00
               ( 当日でクリックした時分秒 を 2002-02-19 08:15:32 のように
                   出力したい時はcfgにフラグ指定の予定 )


 凡例 (注 : 大文字小文字は区別します)
    Y 年
    M 月
    D 日
    W 曜
    h 時
    m 分
    s 秒

(注 : フォーマット用の文字列YMDWhmsは大文字小文字を区別します。 日付以外で、Y,M,D,W,h,n,s の文字を使うときは\\Yや\\Wなど(ダブルバックスペース「\\」)でエスケープします。 *エスケープは\\Yや\\Wなどの該当文字列を、一旦、「$0_10進アスキーコード$」に変えて、フォーマット後戻すようにしていますので、 文字列、$0_089$、$0_077$、$0_068$、$0_087$、$0_104$、$0_109$、$0_115$は使えません。ソース→ たとえば、YMDW.replace("\\Y","$0_089$") こうやってエンコード後YYYYを2007へ変換してから、YMDW.replace("$0_089$","Y")でデコードして元に戻しています。 )

デフォルトは、W3C-DTF の Complete date: YYYY-MM-DD (例 1997-07-16) でどうかな?
参考:W3C NOTE-datetime Date and Time Formats
参考:日付の表記に関するノート W3Cの日時フォーマット

2007-11-11 <input class="jquery-calendear" type="text"> だけで、jsに触らずに起動

2007-11-11 cfg.offset.x と cfg.offset.y を引数cfgのプロパティに追加