本文說明datepicker Methods 中的 getDate setDate

其效果取得日期及設定日期

一、基本JS/HTML語法

JS： 

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

二、基本說明

setDate 設定日期

$("#datepicker").datepicker("setDate",Date 物件);

getDate 取得日期

$("#datepicker").datepicker("getDate")

三、程式內容 

<html>
<head>
<title>jquery.datepicker 19</title>
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="-1" />
<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() {
    //19-jQuery datepicker Methods getDate setDate
    $("#datepicker").datepicker({
      //設定日期格式
      dateFormat : "yy/mm/dd"
    });
    $(".setDate").bind("click", function() {
      $("#datepicker").datepicker("setDate",$.datepicker.parseDate("yy/mm/dd", "2008/08/08"));
      $("#showDateBox").append($("#datepicker").datepicker("getDate"));
    });
  });
</script>
</head>
<body>
  <div class="datetest">
    <p class="datag">
      Date: <input type="text" id="datepicker" value="">
    </p>
  </div>
  <div>說明：jQuery datepicker Methods getDate setDate</div>
  <div>
    <ul>
      <li><a href="javascript:void(0)" class="setDate">設定日期為2008/08/08</a></li>
    </ul>
  </div>
  <div id="showDateBox"></div>
</body>
</html>

四、執行

圖1

五、測試

Date: 

說明：jQuery datepicker Methods getDate setDate

相關參考：

其它參考：

jQuery教學目錄

其它文章


​
arrow
arrow
    文章標籤
    datepicker jquery setdate 目錄 getdate 教學 月曆 設定 div script ui methods dateformat 日期 content js cache 其它 效果 class
    全站熱搜

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

    E-mail轉寄