close

本文說明datepicker 中的 parseDate formatDate

其功能是對日期解析及對日期的格式設定

一、基本JS/HTML語法

JS:

$.datepicker.parseDate("yy/mm/dd", "2008/08/08");

$.datepicker.formatDate("yy/mm/dd", new Date(2008, 8 - 1, 8));

二、基本說明

$.datepicker.formatDate( format, date, options )

$.datepicker.formatDate("日期格式", 日期物件Date, 參數設定)

$.datepicker.parseDate( format, value, options )

$.datepicker.parseDate("日期格式", "字串日期", 參數設定)

日期格式:

d - 每月的第幾天 (單位數沒有補零)

dd - 每月的第幾天 (兩位數字)

o - 一年中的第幾天 (前無補零)

oo - 一年中的第幾天 (三位數字)

D - day name short

DD - day name long

m - 月份 (前無補零)

mm - 月份 (兩位數字)

M - month name short

MM - month name long

y - 年份 (兩位數字)

yy - 年份 (四位數字)

@ - Unix 時間戳 (從 01/01/1970 開始)

'...' - 文本

'' - 單引號

其它標準日期格式:

ATOM - 'yy-mm-dd' (Same as RFC 3339/ISO 8601)

COOKIE - 'D, dd M yy'

ISO_8601 - 'yy-mm-dd'

RFC_822 - 'D, d M y'

RFC_850 - 'DD, dd-M-y'

RFC_1036 - 'D, d M y

RFC_1123 - 'D, d M yy'

RFC_2822 - 'D, d M yy'

RSS - 'D, d M y'

TIMESTAMP - '@'

W3C - 'yy-mm-dd'

參考:jqueryui api formatDate 

三、程式內容

<html>
<head>
<title>jquery.datepicker 9</title>
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
  $(function() {
    $("#datepicker").datepicker({
      appendText : "(西元年-月-日)",
      altField : "#datepicker",
      altFormat : "yy/mm/dd",
      dateFormat : "yy/mm/dd"
    });
    $(".setDate").bind(
        "click",
        function() {
   var myDate = $.datepicker.parseDate("yy/mm/dd", "2008/08/08");
   var setDateTest = $.datepicker.formatDate("yy/mm/dd", myDate);
   $("#datepicker").datepicker().val(setDateTest);
        });
  });
</script>
</head>
<body>
  <div class="datetest">
    <p class="datag">
      Date: <input type="text" id="datepicker" value="">
    </p>
  </div>
  <div>說明:formatDate及parseDate方法的使用</div>
  <div>
    <ul>
      <li><a href="#" class="setDate">設定日期為2008/08/08</a></li>
    </ul>
  </div>
</body>
</html>

四、執行

圖1


相關參考:

其它參考:

jQuery教學目錄

其它文章



arrow
arrow

    PG Levin Li 發表在 痞客邦 留言(0) 人氣()