<ruby id="bdb3f"></ruby>

    <p id="bdb3f"><cite id="bdb3f"></cite></p>

      <p id="bdb3f"><cite id="bdb3f"><th id="bdb3f"></th></cite></p><p id="bdb3f"></p>
        <p id="bdb3f"><cite id="bdb3f"></cite></p>

          <pre id="bdb3f"></pre>
          <pre id="bdb3f"><del id="bdb3f"><thead id="bdb3f"></thead></del></pre>

          <ruby id="bdb3f"><mark id="bdb3f"></mark></ruby><ruby id="bdb3f"></ruby>
          <pre id="bdb3f"><pre id="bdb3f"><mark id="bdb3f"></mark></pre></pre><output id="bdb3f"></output><p id="bdb3f"></p><p id="bdb3f"></p>

          <pre id="bdb3f"><del id="bdb3f"><progress id="bdb3f"></progress></del></pre>

                <ruby id="bdb3f"></ruby>

                ??一站式輕松地調用各大LLM模型接口,支持GPT4、智譜、豆包、星火、月之暗面及文生圖、文生視頻 廣告
                # Datepicker Widget Categories: [Widgets](http://www.css88.com/jquery-ui-api/category/widgets/ "View all posts in Widgets") ## version added: 1.0 **Description:** 從彈出框或內聯日歷選擇一個日期。 ## QuickNav[Examples](#entry-examples) ### Options + [altField](#option-altField) + [altFormat](#option-altFormat) + [appendText](#option-appendText) + [autoSize](#option-autoSize) + [beforeShow](#option-beforeShow) + [beforeShowDay](#option-beforeShowDay) + [buttonImage](#option-buttonImage) + [buttonImageOnly](#option-buttonImageOnly) + [buttonText](#option-buttonText) + [calculateWeek](#option-calculateWeek) + [changeMonth](#option-changeMonth) + [changeYear](#option-changeYear) + [closeText](#option-closeText) + [constrainInput](#option-constrainInput) + [currentText](#option-currentText) + [dateFormat](#option-dateFormat) + [dayNames](#option-dayNames) + [dayNamesMin](#option-dayNamesMin) + [dayNamesShort](#option-dayNamesShort) + [defaultDate](#option-defaultDate) + [duration](#option-duration) + [firstDay](#option-firstDay) + [gotoCurrent](#option-gotoCurrent) + [hideIfNoPrevNext](#option-hideIfNoPrevNext) + [isRTL](#option-isRTL) + [maxDate](#option-maxDate) + [minDate](#option-minDate) + [monthNames](#option-monthNames) + [monthNamesShort](#option-monthNamesShort) + [navigationAsDateFormat](#option-navigationAsDateFormat) + [nextText](#option-nextText) + [numberOfMonths](#option-numberOfMonths) + [onChangeMonthYear](#option-onChangeMonthYear) + [onClose](#option-onClose) + [onSelect](#option-onSelect) + [prevText](#option-prevText) + [selectOtherMonths](#option-selectOtherMonths) + [shortYearCutoff](#option-shortYearCutoff) + [showAnim](#option-showAnim) + [showButtonPanel](#option-showButtonPanel) + [showCurrentAtPos](#option-showCurrentAtPos) + [showMonthAfterYear](#option-showMonthAfterYear) + [showOn](#option-showOn) + [showOptions](#option-showOptions) + [showOtherMonths](#option-showOtherMonths) + [showWeek](#option-showWeek) + [stepMonths](#option-stepMonths) + [weekHeader](#option-weekHeader) + [yearRange](#option-yearRange) + [yearSuffix](#option-yearSuffix) ### Methods + [destroy](#method-destroy) + [dialog](#method-dialog) + [getDate](#method-getDate) + [hide](#method-hide) + [isDisabled](#method-isDisabled) + [option](#method-option) + [refresh](#method-refresh) + [setDate](#method-setDate) + [show](#method-show) + [widget](#method-widget) ### Events jQuery UI 日期選擇器(Datepicker)是向頁面添加日期選擇功能的高度可配置插件。您可以自定義日期格式和語言,限制可選擇的日期范圍,添加按鈕和其他導航選項。 默認情況下,當相關的文本域獲得焦點時,在一個小的覆蓋層打開日期選擇器。對于一個內聯的日歷,只需簡單地將日期選擇器附加到 div 或者 span 上。 ### 鍵盤交互 當日期選擇器打開時,下面的鍵盤命令可用: * PAGE UP:移到上一個月。 * PAGE DOWN:移到下一個月。 * CTRL+PAGE UP:移到上一年。 * CTRL+PAGE DOWN:移到下一年。 * CTRL+HOME:移到當前月份。如果日期選擇器是關閉的則打開。 * CTRL+LEFT:移到上一天。 * CTRL+RIGHT:移到下一天。 * CTRL+UP:移到上一周。 * CTRL+DOWN:移到下一周。 * ENTER:選擇聚焦的日期。 * CTRL+END:關閉日期選擇器,并清除日期。 * ESCAPE:關閉日期選擇器,不做任何選擇。 ### 實用功能 #### $.datepicker.setDefaults( settings ) 為所有的日期選擇器改變默認設置。 使用 [`option()`](#method-option) 方法來改變個別實例的設置。 **Code examples:** 設置所有的日期選擇器在獲得焦點時或點擊圖標時打開。 ``` $.datepicker.setDefaults({ showOn: "both", buttonImageOnly: true, buttonImage: "calendar.gif", buttonText: "Calendar" }); ``` 設置所有的日期選擇器都有法語文本。 ``` $.datepicker.setDefaults( $.datepicker.regional[ "fr" ] ); ``` #### $.datepicker.formatDate( format, date, settings ) 格式化日期為一個帶有指定格式的字符串值。 格式可以是下列組合: * d - 一月中的第幾天(沒有前導零) * dd - 一月中的第幾天(兩位數) * o - 一年中的第幾天(沒有前導零) * oo - 一年中的第幾天(三位數) * D - 天的短名稱 * DD - 天的長名稱 * m - 一年中的第幾月(沒有前導零) * mm - 一年中的第幾月(兩位數) * M - 月的短名稱 * MM - 月的長名稱 * y - 年(兩位數) * yy - 年(四位數) * @ - Unix 時間戳(ms since 01/01/1970) * ! - Windows 鐘表(100ns since 01/01/0001) * '...' - 文本 * '' - 單引號 * 其他 - 文本 也有一些 `$.datepicker` 預定義的標準日期格式: * ATOM - 'yy-mm-dd' (與 RFC 3339/ISO 8601 相同) * COOKIE - 'D, dd M yy' * ISO_8601 - 'yy-mm-dd' * RFC_822 - 'D, d M y' (參照 RFC 822) * RFC_850 - 'DD, dd-M-y' (參照 RFC 850) * RFC_1036 - 'D, d M y' (參照 RFC 1036) * RFC_1123 - 'D, d M yy' (參照 RFC 1123) * RFC_2822 - 'D, d M yy' (參照 RFC 2822) * RSS - 'D, d M y' (與 RFC 822 相同) * TICKS - '!' * TIMESTAMP - '@' * W3C - 'yy-mm-dd' (與 ISO 8601 相同) **Code examples:** 以 ISO 格式顯示日期。產生 "2007-01-26"。 ``` $.datepicker.formatDate( "yy-mm-dd", new Date( 2007, 1 - 1, 26 ) ); ``` 以擴展法語格式顯示日期。產生 "Samedi, Juillet 14, 2007"。 ``` $.datepicker.formatDate( "DD, MM d, yy", new Date( 2007, 7 - 1, 14 ), { dayNamesShort: $.datepicker.regional[ "fr" ].dayNamesShort, dayNames: $.datepicker.regional[ "fr" ].dayNames, monthNamesShort: $.datepicker.regional[ "fr" ].monthNamesShort, monthNames: $.datepicker.regional[ "fr" ].monthNames }); ``` #### $.datepicker.parseDate( format, value, settings ) 從一個指定格式的字符串值中提取日期。 格式可以是下列組合: * d - 一月中的第幾天(沒有前導零) * dd - 一月中的第幾天(兩位數) * o - 一年中的第幾天(沒有前導零) * oo - 一年中的第幾天(三位數) * D - 星期幾的短名稱 * DD - 星期幾的長名稱 * m - 一年中的第幾月(沒有前導零) * mm - 一年中的第幾月(兩位數) * M - 月的短名稱 * MM - 月的長名稱 * y - 年(兩位數) * yy - 年(四位數) * @ - Unix 時間戳(ms since 01/01/1970) * ! - Windows 鐘表(100ns since 01/01/0001) * '...' - 文本 * '' - 單引號 * 其他 - 文本 一些可能被拋出的異常: * 'Invalid arguments' - 如果格式或值為空則拋出此異常。 * 'Missing number at position nn' - 如果格式顯示一個未找到的數值則拋出此異常。 * 'Unknown name at position nn' - 如果格式顯示一個未找到的星期幾名稱或月份名稱則拋出此異常。 * 'Unexpected literal at position nn' - 如果格式顯示一個未找到的文本值則拋出此異常。 * 'Invalid date' - 如果日期無效則拋出此異常,比如 '31/02/2007'。 **Code examples:** 提取一個 ISO 格式的日期。 ``` $.datepicker.parseDate( "yy-mm-dd", "2007-01-26" ); ``` 提取一個擴展法語格式的日期。 ``` $.datepicker.parseDate( "DD, MM d, yy", "Samedi, Juillet 14, 2007", { shortYearCuroff: 20, dayNamesShort: $.datepicker.regional[ "fr" ].dayNamesShort, dayNames: $.datepicker.regional[ "fr" ].dayNames, monthNamesShort: $.datepicker.regional[ "fr" ].monthNamesShort, monthNames: $.datepicker.regional[ "fr" ].monthNames }); ``` #### $.datepicker.iso8601Week( date ) 確定一個給定的日期在一年中的第幾周:1 到 53。 該函數使用 ISO 8601 定義一周:一周從星期一開始,每一年的第一周包含 1 月 4 日。這意味著上一年至多有三天可能包含在當年的第一周中,當年至多有三天可能包含在上一年的最后一周中。 該函數是 [`calculateWeek`](#option-calculateWeek) 選項的默認實現。 **Code examples:** 查找日期在一年中的第幾周。 ``` $.datepicker.iso8601Week( new Date( 2007, 1 - 1, 26 ) ); ``` #### $.datepicker.noWeekends 設置如 beforeShowDay 函數,防止選擇周末。 我們可以在 [`beforeShowDay`](#option-beforeShowDay) 選項中提供 `noWeekends()` 函數,用來計算所有工作日,提供一個 `true`/`false` 值的數組,用來指示日期是否可選擇。 **Code examples:** 設置 DatePicker,讓周末不可選。 ``` $( "#datepicker" ).datepicker({ beforeShowDay: $.datepicker.noWeekends }); ``` ### 局限 日期選擇器提供了迎合不同的語言和日期格式本地化內容的支持。每個本地化包含在名稱后追加語言代碼的文件中,例如法語為 `jquery.ui.datepicker-fr.js`。所需的本地化文件需要包含在主要的日期選擇器代碼后面。每個本地化文件添加了它自己的設置到可用的本地化集合中,所有實例自動應用這些設置為默認設置。 `$.datepicker.regional` 屬性保存了一個本地化數組,以語言代碼作為前置,默認前置為 `""`,表示英語。每個條目是一個帶有下列屬性的對象:`closeText` 、 `prevText` 、 `nextText` 、 `currentText` 、 `monthNames` 、 `monthNamesShort` 、 `dayNames` 、 `dayNamesShort` 、 `dayNamesMin` 、 `weekHeader` 、 `dateFormat` 、 `firstDay` 、 `isRTL` 、 `showMonthAfterYear` 和 `yearSuffix`。 您可以通過下面代碼恢復默認的本地化: `$.datepicker.setDefaults( $.datepicker.regional[ "" ] );` 您可以通過下面代碼覆蓋一個特定地點的日期選擇器: `$( selector ).datepicker( $.datepicker.regional[ "fr" ] );` ### 主題 日期選擇器部件(Datepicker Widget)使用 [jQuery UI CSS 框架](/theming/css-framework/) 來定義它的外觀和感觀的樣式。如果需要使用日期選擇器指定的樣式,則可以使用下面的 CSS class 名稱: * `ui-datepicker`:日期選擇器的外層容器。如果日期選擇器是內聯的,該元素會另外帶有一個 `ui-datepicker-inline` class。如果設置了 [`isRTL`](#option-isRTL) 選項,該元素會另外帶有一個 `ui-datepicker-rtl` class。 * `ui-datepicker-header`:日期選擇器的頭部容器。 * `ui-datepicker-prev`:用于選擇上一月的控件。 * `ui-datepicker-next`:用于選擇下一月的控件。 * `ui-datepicker-title`:日期選擇器包含月和年的標題容器。 * `ui-datepicker-month`:月的文本顯示,如果設置了 [`changeMonth`](#option-changeMonth) 選項則顯示 `&lt;select&gt;` 元素。 * `ui-datepicker-year`:年的文本顯示,如果設置了 [`changeYear`](#option-changeYear) 選項則顯示 `&lt;select&gt;` 元素。 * `ui-datepicker-calendar`:包含日歷的表格。 * `ui-datepicker-week-end`:周末的單元格。: Cells containing weekend days. * `ui-datepicker-other-month`:發生在某月但不是當前月天數的單元格。 * `ui-datepicker-unselectable`:用戶不可選擇的單元格。 * `ui-datepicker-current-day`:已選中日期的單元格。 * `ui-datepicker-today`:當天日期的單元格。 * `ui-datepicker-buttonpane`:當設置 [`showButtonPanel`](#option-showButtonPanel) 選項時使用按鈕面板(buttonpane)。 * `ui-datepicker-current`:用于選擇當天日期的按鈕。 如果 [`numberOfMonths`](#option-numberOfMonths) 選項用于顯示多個月份,則使用一些額外的 class: * `ui-datepicker-multi`:一個多月份日期選擇器的最外層容器。該元素會根據要顯示的月份個數另外帶有 `ui-datepicker-multi-2`、`ui-datepicker-multi-3` 或 `ui-datepicker-multi-4` class 名稱。 * `ui-datepicker-group`:分組內單獨的選擇器。該元素會根據它在分組中的位置另外帶有 `ui-datepicker-group-first`、`ui-datepicker-group-middle` 或 `ui-datepicker-group-last` class 名稱。 ### 依賴 * [UI 核心(UI Core)](/category/ui-core/) * [特效核心(Effects Core)](/category/effects-core/)(可選的;當與 [`showAnim`](#option-showAnim) 選項一起使用時) ### 其他注意事項: * 該部件要求一些功能性的 CSS,否則將無法工作。如果您創建了一個自定義的主題,請使用小部件指定的 CSS 文件作為起點。 * 該部件以編程方式操作元素的值,因此當元素的值改變時不會觸發原生的 `change` 事件。 * 不支持在 `&lt;input type="date"&gt;` 上創建日期選擇器,因為會造成與本地選擇器的 UI 沖突。 ## Options ### altField**Type:** [Selector](http://api.jquery.com/Types/#Selector) or [jQuery](http://api.jquery.com/Types/#jQuery) or [Element](http://api.jquery.com/Types/#Element) **Default:** `""`一個input元素 ,使用選擇器 選擇的另一個地方更新datepicker選擇的日期. 使用 [`altFormat`](#option-altFormat) 指定的這一區域設置如下改變格式的日期(使用input最直觀). 如果沒有代替的區域則使用空白.**Code examples:** 初始化帶有指定 `altField` 選項的 datepicker: ``` $( ".selector" ).datepicker({ altField: "#actualDate" }); ``` 在初始化后,獲取或設置`altField` 選項: ``` // getter var altField = $( ".selector" ).datepicker( "option", "altField" ); // setter $( ".selector" ).datepicker( "option", "altField", "#actualDate" ); ``` ### altFormat**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `""`[`dateFormat`](#option-dateFormat) 被 [`altField`](#option-altField) 項所使用。 它的目的是允許選擇一種日期格式顯示給用戶以供選擇,而實際的格式則是來自后臺。 對于可能的格式的完整列表,請參閱 [`formatDate`](#utility-formatDate) 函數。**Code examples:** 初始化帶有指定 `altFormat` 選項的 datepicker: ``` $( ".selector" ).datepicker({ altFormat: "yy-mm-dd" }); ``` 在初始化后,獲取或設置`altFormat` 選項: ``` // getter var altFormat = $( ".selector" ).datepicker( "option", "altFormat" ); // setter $( ".selector" ).datepicker( "option", "altFormat", "yy-mm-dd" ); ``` ### appendText**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `""`顯示每個日期字段后面的文本, 例如,以顯示所需的格式。**Code examples:** 初始化帶有指定 `appendText` 選項的 datepicker: ``` $( ".selector" ).datepicker({ appendText: "(yyyy-mm-dd)" }); ``` 在初始化后,獲取或設置`appendText` 選項: ``` // getter var appendText = $( ".selector" ).datepicker( "option", "appendText" ); // setter $( ".selector" ).datepicker( "option", "appendText", "(yyyy-mm-dd)" ); ``` ### autoSize**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`如果設置為`true`,將自動調整輸入字段,以適應日期在當前的[`dateFormat`](#option-dateFormat)。**Code examples:** 初始化帶有指定 `autoSize` 選項的 datepicker: ``` $( ".selector" ).datepicker({ autoSize: true }); ``` 在初始化后,獲取或設置`autoSize` 選項: ``` // getter var autoSize = $( ".selector" ).datepicker( "option", "autoSize" ); // setter $( ".selector" ).datepicker( "option", "autoSize", true ); ``` ### beforeShow**Type:** [Function](http://api.jquery.com/Types/#Function)( [Element](http://api.jquery.com/Types/#Element) input, [Object](http://api.jquery.com/Types/#Object) inst ) **Default:** `null`一個函數,它接受一個輸入字段和當前的datepicker實例, 并返回一個選項對象來修改datepicker。只在datepicker顯示之前被調用。 ### beforeShowDay**Type:** [Function](http://api.jquery.com/Types/#Function)( [Date](http://api.jquery.com/Types/#Date) date ) **Default:** `null`一個函數,它接受一個日期作為參數 并且 必須返回一個數組: * `[0]`: `true`/`false` 表示這個日期是否可選 * `[1]`: 一個 CSS class 名 添加到日期的單元格 或默認描述為`""`。 * `[2]`:一個可選的日期彈出提示 該函數在datepicker 每一天顯示之前被調用。 ### buttonImage**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `""`當[`showOn`](#option-showOn)選項設置為`"button"`或`"both"`時, 用于顯示datepicker的圖片url地址。 如果設置,[`buttonText`](#option-buttonText)選項將成為`alt`值,而不是直接顯示。**Code examples:** 初始化帶有指定 `buttonImage` 選項的 datepicker: ``` $( ".selector" ).datepicker({ buttonImage: "/images/datepicker.gif" }); ``` 在初始化后,獲取或設置`buttonImage` 選項: ``` // getter var buttonImage = $( ".selector" ).datepicker( "option", "buttonImage" ); // setter $( ".selector" ).datepicker( "option", "buttonImage", "/images/datepicker.gif" ); ``` ### buttonImageOnly**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`無論是按鈕 圖像 必須自行提供 而不是 里面一個按鈕元素。 此選項僅當[`buttonImage`](#option-buttonImage)選項也被設置時才起作用。**Code examples:** 初始化帶有指定 `buttonImageOnly` 選項的 datepicker: ``` $( ".selector" ).datepicker({ buttonImageOnly: true }); ``` 在初始化后,獲取或設置`buttonImageOnly` 選項: ``` // getter var buttonImageOnly = $( ".selector" ).datepicker( "option", "buttonImageOnly" ); // setter $( ".selector" ).datepicker( "option", "buttonImageOnly", true ); ``` ### buttonText**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"..."`顯示在觸發按鈕上的文本。和[`showOn`](#option-showOn)設置為 `"button"` 或 `"both"`時結合使用。**Code examples:** 初始化帶有指定 `buttonText` 選項的 datepicker: ``` $( ".selector" ).datepicker({ buttonText: "Choose" }); ``` 在初始化后,獲取或設置`buttonText` 選項: ``` // getter var buttonText = $( ".selector" ).datepicker( "option", "buttonText" ); // setter $( ".selector" ).datepicker( "option", "buttonText", "Choose" ); ``` ### calculateWeek**Type:** [Function](http://api.jquery.com/Types/#Function)() **Default:** `jQuery.datepicker.iso8601Week`一個函數來計算當前周是一年中的第幾周。 默認實現使用ISO8601的定義:的定義執行: 每周從周一開始;每年的第一個星期包含這年的第一個星期四。愚人碼頭注:這意味著今年的第一周中可能會包含去年的3天,并且今年的3天可能會被包含進去年的最后一周中。**Code examples:** 初始化帶有指定 `calculateWeek` 選項的 datepicker: ``` $( ".selector" ).datepicker({ calculateWeek: myWeekCalc }); ``` 在初始化后,獲取或設置`calculateWeek` 選項: ``` // getter var calculateWeek = $( ".selector" ).datepicker( "option", "calculateWeek" ); // setter $( ".selector" ).datepicker( "option", "calculateWeek", myWeekCalc ); ``` ### changeMonth**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`允許你將月份修改為一個下拉菜單。 你可以將參數設置為false來禁用此功能,也就是顯示為文字。**Code examples:** 初始化帶有指定 `changeMonth` 選項的 datepicker: ``` $( ".selector" ).datepicker({ changeMonth: true }); ``` 在初始化后,獲取或設置`changeMonth` 選項: ``` // getter var changeMonth = $( ".selector" ).datepicker( "option", "changeMonth" ); // setter $( ".selector" ).datepicker( "option", "changeMonth", true ); ``` ### changeYear**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`允許你將年份修改為一個下拉菜單。 你可以將參數設置為false來禁用此功能,也就是顯示為文字。使用[`yearRange`](#option-yearRange)選項來控制哪些年是可供選擇。**Code examples:** 初始化帶有指定 `changeYear` 選項的 datepicker: ``` $( ".selector" ).datepicker({ changeYear: true }); ``` 在初始化后,獲取或設置`changeYear` 選項: ``` // getter var changeYear = $( ".selector" ).datepicker( "option", "changeYear" ); // setter $( ".selector" ).datepicker( "option", "changeYear", true ); ``` ### closeText**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"Done"`關閉連接顯示的文字。使用[`showButtonPanel`](#option-showButtonPanel)選項以顯示此按鈕。**Code examples:** 初始化帶有指定 `closeText` 選項的 datepicker: ``` $( ".selector" ).datepicker({ closeText: "Close" }); ``` 在初始化后,獲取或設置`closeText` 選項: ``` // getter var closeText = $( ".selector" ).datepicker( "option", "closeText" ); // setter $( ".selector" ).datepicker( "option", "closeText", "Close" ); ``` ### constrainInput**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `true`當值為`true`時,在輸入欄的輸入被限制為當前的日期格式[`dateFormat`](#option-dateFormat)選項允許的字符。**Code examples:** 初始化帶有指定 `constrainInput` 選項的 datepicker: ``` $( ".selector" ).datepicker({ constrainInput: false }); ``` 在初始化后,獲取或設置`constrainInput` 選項: ``` // getter var constrainInput = $( ".selector" ).datepicker( "option", "constrainInput" ); // setter $( ".selector" ).datepicker( "option", "constrainInput", false ); ``` ### currentText**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"Today"`當前日期鏈接以文本形式顯示。使用 [`showButtonPanel`](#option-showButtonPanel)選項以顯示此按鈕。**Code examples:** 初始化帶有指定 `currentText` 選項的 datepicker: ``` $( ".selector" ).datepicker({ currentText: "Now" }); ``` 在初始化后,獲取或設置`currentText` 選項: ``` // getter var currentText = $( ".selector" ).datepicker( "option", "currentText" ); // setter $( ".selector" ).datepicker( "option", "currentText", "Now" ); ``` ### dateFormat**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"mm/dd/yy"`描述和顯示日期的格式。 對于可能的格式的完整列表,請參閱`[`formatDate`](#utility-formatDate)`函數。**Code examples:** 初始化帶有指定 `dateFormat` 選項的 datepicker: ``` $( ".selector" ).datepicker({ dateFormat: "yy-mm-dd" }); ``` 在初始化后,獲取或設置`dateFormat` 選項: ``` // getter var dateFormat = $( ".selector" ).datepicker( "option", "dateFormat" ); // setter $( ".selector" ).datepicker( "option", "dateFormat", "yy-mm-dd" ); ``` ### dayNames**Type:** [Array](http://api.jquery.com/Types/#Array) **Default:** `[ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ]`日期長的名字的列表,從星期日(Sunday)開始,依照 [`dateFormat`](#option-dateFormat)的設置進行使用。**Code examples:** 初始化帶有指定 `dayNames` 選項的 datepicker: ``` $( ".selector" ).datepicker({ dayNames: [ "Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi" ] }); ``` 在初始化后,獲取或設置`dayNames` 選項: ``` // getter var dayNames = $( ".selector" ).datepicker( "option", "dayNames" ); // setter $( ".selector" ).datepicker( "option", "dayNames", [ "Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi" ] ); ``` ### dayNamesMin**Type:** [Array](http://api.jquery.com/Types/#Array) **Default:** `[ "Su", "Mo", "Tu", "We", "Th", "Fr", "Sa" ]`日期最小化簡稱的列表, 從周日開始(Sunday), 用在datepicker每列的頭部.。**Code examples:** 初始化帶有指定 `dayNamesMin` 選項的 datepicker: ``` $( ".selector" ).datepicker({ dayNamesMin: [ "Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa" ] }); ``` 在初始化后,獲取或設置`dayNamesMin` 選項: ``` // getter var dayNamesMin = $( ".selector" ).datepicker( "option", "dayNamesMin" ); // setter $( ".selector" ).datepicker( "option", "dayNamesMin", [ "Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa" ] ); ``` ### dayNamesShort**Type:** [Array](http://api.jquery.com/Types/#Array) **Default:** `[ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" ]`日期名稱的簡寫的列表, 從周日開始(Sunday), 依照[`dateFormat`](#option-dateFormat)的設置使用。**Code examples:** 初始化帶有指定 `dayNamesShort` 選項的 datepicker: ``` $( ".selector" ).datepicker({ dayNamesShort: [ "Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam" ] }); ``` 在初始化后,獲取或設置`dayNamesShort` 選項: ``` // getter var dayNamesShort = $( ".selector" ).datepicker( "option", "dayNamesShort" ); // setter $( ".selector" ).datepicker( "option", "dayNamesShort", [ "Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam" ] ); ``` ### defaultDate**Type:** [Date](http://api.jquery.com/Types/#Date) or [Number](http://api.jquery.com/Types/#Number) or [String](http://api.jquery.com/Types/#String) **Default:** `null`如果該字段為空時設置第一次打開時顯示的日期。 通過Date對象或字符串在當前 [`dateFormat`](#option-dateFormat)中指定任何一個實際的日期, 或者一個和今天對比的數字(例如 +7) 或者一個連續的字符串值('y' 表示年, 'm' 表示月, 'w'表示周, 'd'表示日, 例如. '+1m +7d'), 或者為空則是今天.**支持多個類型:** * **Date**: 一個包含默認日期的date對象。 * **Number**: 一個和今天對比的數字。例如 `2` 表示從今天開始的第二天,(愚人碼頭注:即:后天), `-1` 表示昨天。 * **String**: 一個由[`dateFormat`](#option-dateFormat)選項定義格式的字符串 , 或相對日期。 ?相對日期必須包含值和期間對; 有效期間為:`"y"`表示幾年, `"m"` 表示幾月, `"w"`表示幾周,和`"d"`表示幾天。 例如, `"+1m +7d"`表示從今天開始的一個月加七天。 **Code examples:** 初始化帶有指定 `defaultDate` 選項的 datepicker: ``` $( ".selector" ).datepicker({ defaultDate: +7 }); ``` 在初始化后,獲取或設置`defaultDate` 選項: ``` // getter var defaultDate = $( ".selector" ).datepicker( "option", "defaultDate" ); // setter $( ".selector" ).datepicker( "option", "defaultDate", +7 ); ``` ### duration**Type:** [](http://api.jquery.com/Types/#)or [String](http://api.jquery.com/Types/#String) **Default:** `"normal"`設置datepicker展開動畫的顯示時間,可以是一個毫秒值, 也可以使用以下的三種字符值來表示("slow", "normal", "fast"), 或者為 ''則馬上顯示。**Code examples:** 初始化帶有指定 `duration` 選項的 datepicker: ``` $( ".selector" ).datepicker({ duration: "slow" }); ``` 在初始化后,獲取或設置`duration` 選項: ``` // getter var duration = $( ".selector" ).datepicker( "option", "duration" ); // setter $( ".selector" ).datepicker( "option", "duration", "slow" ); ``` ### firstDay**Type:** [Integer](http://api.jquery.com/Types/#Integer) **Default:** `0`設置一周中的第一天:周日是 `0`, 周一是 `1`, 以此類推。**Code examples:** 初始化帶有指定 `firstDay` 選項的 datepicker: ``` $( ".selector" ).datepicker({ firstDay: 1 }); ``` 在初始化后,獲取或設置`firstDay` 選項: ``` // getter var firstDay = $( ".selector" ).datepicker( "option", "firstDay" ); // setter $( ".selector" ).datepicker( "option", "firstDay", 1 ); ``` ### gotoCurrent**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`如果設置為`true`, 當前日的鏈接將移動到當前選中的日期,而不是??今天。**Code examples:** 初始化帶有指定 `gotoCurrent` 選項的 datepicker: ``` $( ".selector" ).datepicker({ gotoCurrent: true }); ``` 在初始化后,獲取或設置`gotoCurrent` 選項: ``` // getter var gotoCurrent = $( ".selector" ).datepicker( "option", "gotoCurrent" ); // setter $( ".selector" ).datepicker( "option", "gotoCurrent", true ); ``` ### hideIfNoPrevNext**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`通常當前一個和下一個鏈接被禁用時不適用 (參看 [`minDate`](#option-minDate) 和 [`maxDate`](#option-maxDate)). 你可以通過設置此屬性為`true`完全的隱藏他們.**Code examples:** 初始化帶有指定 `hideIfNoPrevNext` 選項的 datepicker: ``` $( ".selector" ).datepicker({ hideIfNoPrevNext: true }); ``` 在初始化后,獲取或設置`hideIfNoPrevNext` 選項: ``` // getter var hideIfNoPrevNext = $( ".selector" ).datepicker( "option", "hideIfNoPrevNext" ); // setter $( ".selector" ).datepicker( "option", "hideIfNoPrevNext", true ); ``` ### isRTL**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`當前語言描述是否為自右向左的。(愚人碼頭注:例如阿拉伯語)**Code examples:** 初始化帶有指定 `isRTL` 選項的 datepicker: ``` $( ".selector" ).datepicker({ isRTL: true }); ``` 在初始化后,獲取或設置`isRTL` 選項: ``` // getter var isRTL = $( ".selector" ).datepicker( "option", "isRTL" ); // setter $( ".selector" ).datepicker( "option", "isRTL", true ); ``` ### maxDate**Type:** [Date](http://api.jquery.com/Types/#Date) or [Number](http://api.jquery.com/Types/#Number) or [String](http://api.jquery.com/Types/#String) **Default:** `null`最大的可選日期。當設置為`null`時,沒有上限。**支持多個類型:** * **Date**: 一個包含默認日期的date對象。 * **Number**: 一個和今天對比的數字。例如 `2` 表示從今天開始的第二天,(愚人碼頭注:即:后天), `-1` 表示昨天。 * **String**: 一個由[`dateFormat`](#option-dateFormat)選項定義格式的字符串 , 或相對日期。 ?相對日期必須包含值和期間對; 有效期間為:`"y"`表示幾年, `"m"` 表示幾月, `"w"`表示幾周,和`"d"`表示幾天。 例如, `"+1m +7d"`表示從今天開始的一個月加七天。 **Code examples:** 初始化帶有指定 `maxDate` 選項的 datepicker: ``` $( ".selector" ).datepicker({ maxDate: "+1m +1w" }); ``` 在初始化后,獲取或設置`maxDate` 選項: ``` // getter var maxDate = $( ".selector" ).datepicker( "option", "maxDate" ); // setter $( ".selector" ).datepicker( "option", "maxDate", "+1m +1w" ); ``` ### minDate**Type:** [Date](http://api.jquery.com/Types/#Date) or [Number](http://api.jquery.com/Types/#Number) or [String](http://api.jquery.com/Types/#String) **Default:** `null`最小的可選日期。當設置為`null`時,沒有下限。**支持多個類型:** * **Date**: 一個包含默認日期的date對象。 * **Number**: 一個和今天對比的數字。例如 `2` 表示從今天開始的第二天,(愚人碼頭注:即:后天), `-1` 表示昨天。 * **String**: 一個由[`dateFormat`](#option-dateFormat)選項定義格式的字符串 , 或相對日期。 ?相對日期必須包含值和期間對; 有效期間為:`"y"`表示幾年, `"m"` 表示幾月, `"w"`表示幾周,和`"d"`表示幾天。 例如, `"+1m +7d"`表示從今天開始的一個月加七天。 **Code examples:** 初始化帶有指定 `minDate` 選項的 datepicker: ``` $( ".selector" ).datepicker({ minDate: new Date(2007, 1 - 1, 1) }); ``` 在初始化后,獲取或設置`minDate` 選項: ``` // getter var minDate = $( ".selector" ).datepicker( "option", "minDate" ); // setter $( ".selector" ).datepicker( "option", "minDate", new Date(2007, 1 - 1, 1) ); ``` ### monthNames**Type:** [Array](http://api.jquery.com/Types/#Array) **Default:** `[ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ]`月份的完全名稱列表,依照 [`dateFormat`](#option-dateFormat)的設置進行使用。**Code examples:** 初始化帶有指定 `monthNames` 選項的 datepicker: ``` $( ".selector" ).datepicker({ monthNames: [ "Januar", "Februar", "Marts", "April", "Maj", "Juni", "Juli", "August", "September", "Oktober", "November", "December" ] }); ``` 在初始化后,獲取或設置`monthNames` 選項: ``` // getter var monthNames = $( ".selector" ).datepicker( "option", "monthNames" ); // setter $( ".selector" ).datepicker( "option", "monthNames", [ "Januar", "Februar", "Marts", "April", "Maj", "Juni", "Juli", "August", "September", "Oktober", "November", "December" ] ); ``` ### monthNamesShort**Type:** [Array](http://api.jquery.com/Types/#Array) **Default:** `[ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ]`月份簡寫名稱的列表,依照 [`dateFormat`](#option-dateFormat)的設置進行使用。**Code examples:** 初始化帶有指定 `monthNamesShort` 選項的 datepicker: ``` $( ".selector" ).datepicker({ monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "Maj", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec" ] }); ``` 在初始化后,獲取或設置`monthNamesShort` 選項: ``` // getter var monthNamesShort = $( ".selector" ).datepicker( "option", "monthNamesShort" ); // setter $( ".selector" ).datepicker( "option", "monthNamesShort", [ "Jan", "Feb", "Mar", "Apr", "Maj", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec" ] ); ``` ### navigationAsDateFormat**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`確定是[`prevText`](#option-prevText) 和 [`nextText`](#option-nextText)選項是否應該被解析為`[`formatDate`](#utility-formatDate)`函數的日期,讓他們能夠顯示目標的月份名稱.**Code examples:** 初始化帶有指定 `navigationAsDateFormat` 選項的 datepicker: ``` $( ".selector" ).datepicker({ navigationAsDateFormat: true }); ``` 在初始化后,獲取或設置`navigationAsDateFormat` 選項: ``` // getter var navigationAsDateFormat = $( ".selector" ).datepicker( "option", "navigationAsDateFormat" ); // setter $( ".selector" ).datepicker( "option", "navigationAsDateFormat", true ); ``` ### nextText**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"Next"`下個月鏈接顯示的文字 。使用標準ThemeRoller樣式, 這個值被替換為一個圖標。**Code examples:** 初始化帶有指定 `nextText` 選項的 datepicker: ``` $( ".selector" ).datepicker({ nextText: "Later" }); ``` 在初始化后,獲取或設置`nextText` 選項: ``` // getter var nextText = $( ".selector" ).datepicker( "option", "nextText" ); // setter $( ".selector" ).datepicker( "option", "nextText", "Later" ); ``` ### numberOfMonths**Type:** [Number](http://api.jquery.com/Types/#Number) or [Array](http://api.jquery.com/Types/#Array) **Default:** `1`設置一次顯示幾個月.**支持多個類型:** * **Number**: 一行顯示的月份數 * **Array**: 一個數組定義的顯示行數和列數。 **Code examples:** 初始化帶有指定 `numberOfMonths` 選項的 datepicker: ``` $( ".selector" ).datepicker({ numberOfMonths: [ 2, 3 ] }); ``` 在初始化后,獲取或設置`numberOfMonths` 選項: ``` // getter var numberOfMonths = $( ".selector" ).datepicker( "option", "numberOfMonths" ); // setter $( ".selector" ).datepicker( "option", "numberOfMonths", [ 2, 3 ] ); ``` ### onChangeMonthYear**Type:** [Function](http://api.jquery.com/Types/#Function)( [Integer](http://api.jquery.com/Types/#Integer) year, [Integer](http://api.jquery.com/Types/#Integer) month, [Object](http://api.jquery.com/Types/#Object) inst ) **Default:** `null`當datepicker移動到一個新的月份 并/或 年份時調用。 該函數接收選定的年份, 月份(1-12), ?和datepicker實例作為參數。 `this`指向相關聯的輸入域。 ### onClose**Type:** [Function](http://api.jquery.com/Types/#Function)( [String](http://api.jquery.com/Types/#String) dateText, [Object](http://api.jquery.com/Types/#Object) inst ) **Default:** `null`當datepicker關閉時調用,確定一個日期是否被選中。 ?該函數接收所選日期的文本(`""`如果沒有)和datepicker實例作為參數。 `this`指向相關聯的輸入域。 ### onSelect**Type:** [Function](http://api.jquery.com/Types/#Function)( [String](http://api.jquery.com/Types/#String) dateText, [Object](http://api.jquery.com/Types/#Object) inst ) **Default:** `null`當選擇datepicker調用。 ?該函數接收所選日期的文本和datepicker實例作為參數。`this`指向相關聯的輸入域。 ### prevText**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"Prev"`上個月鏈接顯示的文字 。使用標準ThemeRoller樣式, 這個值被替換為一個圖標。**Code examples:** 初始化帶有指定 `prevText` 選項的 datepicker: ``` $( ".selector" ).datepicker({ prevText: "Earlier" }); ``` 在初始化后,獲取或設置`prevText` 選項: ``` // getter var prevText = $( ".selector" ).datepicker( "option", "prevText" ); // setter $( ".selector" ).datepicker( "option", "prevText", "Earlier" ); ``` ### selectOtherMonths**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`顯示在當前月份的之前或之后的日期是否可以被選擇。(愚人碼頭注:比如2014年4月1日是周二,如果[`showOtherMonths`](#option-showOtherMonths)選項設置為`true`,那么2014年3月31日,2014年3月30日會以灰色的形式顯示在4月份的面板上,這個選項表示在4月份的面板上是否可以選擇2014年3月31日,2014年3月30日這兩個日期。5月也是一樣的。) 這選項僅適用于 如果[`showOtherMonths`](#option-showOtherMonths)選項設置為`true`的時候。**Code examples:** 初始化帶有指定 `selectOtherMonths` 選項的 datepicker: ``` $( ".selector" ).datepicker({ selectOtherMonths: true }); ``` 在初始化后,獲取或設置`selectOtherMonths` 選項: ``` // getter var selectOtherMonths = $( ".selector" ).datepicker( "option", "selectOtherMonths" ); // setter $( ".selector" ).datepicker( "option", "selectOtherMonths", true ); ``` ### shortYearCutoff**Type:** [Number](http://api.jquery.com/Types/#Number) or [String](http://api.jquery.com/Types/#String) **Default:** `"+10"`設置一個定義日期所處實際的截斷年份值(與[`dateFormat`](#option-dateFormat)中的 'y'共同使用). 如果是一個數值 (0-99)那么將直接使用這些值. 如果提供的是一個字符串值那么它將被轉換為數值添加到當前年. 一旦截斷年開始計算, 任何輸入的日期的年份小于或者等于它的話將被判定為在本世紀,大于他的將被判定為在上個世紀.**支持多個類型:** * **Number**: 一個 `0` 到 `99`的值表示截斷年份值 * **String**: 從本年份開始的相對年數,例如, `"+3"` or `"-5"`. **Code examples:** 初始化帶有指定 `shortYearCutoff` 選項的 datepicker: ``` $( ".selector" ).datepicker({ shortYearCutoff: 50 }); ``` 在初始化后,獲取或設置`shortYearCutoff` 選項: ``` // getter var shortYearCutoff = $( ".selector" ).datepicker( "option", "shortYearCutoff" ); // setter $( ".selector" ).datepicker( "option", "shortYearCutoff", 50 ); ``` ### showAnim**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"show"`設置顯示/隱藏datepicker的動畫名稱. 使用 `"show"` (默認), `"slideDown"`, `"fadeIn"`, 或其他任何[jQuery UI effects](/category/effects/)的顯示/隱藏效果。 設置為空字符串可以禁用動畫,即直接顯示或者隱藏。**Code examples:** 初始化帶有指定 `showAnim` 選項的 datepicker: ``` $( ".selector" ).datepicker({ showAnim: "fold" }); ``` 在初始化后,獲取或設置`showAnim` 選項: ``` // getter var showAnim = $( ".selector" ).datepicker( "option", "showAnim" ); // setter $( ".selector" ).datepicker( "option", "showAnim", "fold" ); ``` ### showButtonPanel**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`是否顯示日歷下方的按鈕面板。 按鈕面板包含兩個按鈕, 一個今天按鈕鏈接到當前日期, ?和一個完成按鈕關閉datepicker。 該按鈕的文本可以使用[`currentText`](#option-currentText) 和 [`closeText`](#option-closeText)選項分別進行定制。**Code examples:** 初始化帶有指定 `showButtonPanel` 選項的 datepicker: ``` $( ".selector" ).datepicker({ showButtonPanel: true }); ``` 在初始化后,獲取或設置`showButtonPanel` 選項: ``` // getter var showButtonPanel = $( ".selector" ).datepicker( "option", "showButtonPanel" ); // setter $( ".selector" ).datepicker( "option", "showButtonPanel", true ); ``` ### showCurrentAtPos**Type:** [Number](http://api.jquery.com/Types/#Number) **Default:** `0`通過[`numberOfMonths`](#option-numberOfMonths)選項設置多月份顯示的情況下,當前月份顯示的位置。(愚人碼頭注:自頂部/左邊開始第n位,以0開始計數。)**Code examples:** 初始化帶有指定 `showCurrentAtPos` 選項的 datepicker: ``` $( ".selector" ).datepicker({ showCurrentAtPos: 3 }); ``` 在初始化后,獲取或設置`showCurrentAtPos` 選項: ``` // getter var showCurrentAtPos = $( ".selector" ).datepicker( "option", "showCurrentAtPos" ); // setter $( ".selector" ).datepicker( "option", "showCurrentAtPos", 3 ); ``` ### showMonthAfterYear**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`是否在面板的頭部年份后面顯示月份。**Code examples:** 初始化帶有指定 `showMonthAfterYear` 選項的 datepicker: ``` $( ".selector" ).datepicker({ showMonthAfterYear: true }); ``` 在初始化后,獲取或設置`showMonthAfterYear` 選項: ``` // getter var showMonthAfterYear = $( ".selector" ).datepicker( "option", "showMonthAfterYear" ); // setter $( ".selector" ).datepicker( "option", "showMonthAfterYear", true ); ``` ### showOn**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"focus"`設置觸發datepicker自動出現的事件名稱,是focus (`"focus"`)還是clicked (`"button"`)或者任何事件(`"both"`)。**Code examples:** 初始化帶有指定 `showOn` 選項的 datepicker: ``` $( ".selector" ).datepicker({ showOn: "both" }); ``` 在初始化后,獲取或設置`showOn` 選項: ``` // getter var showOn = $( ".selector" ).datepicker( "option", "showOn" ); // setter $( ".selector" ).datepicker( "option", "showOn", "both" ); ``` ### showOptions**Type:** [Object](http://api.jquery.com/Types/#Object) **Default:** `{}`如果想[`showAnim`](#option-showAnim)選項來使用jQuery UI effects動畫效果, 你可以為動畫提供一些額外的設置.**Code examples:** 初始化帶有指定 `showOptions` 選項的 datepicker: ``` $( ".selector" ).datepicker({ showOptions: { direction: "up" } }); ``` 在初始化后,獲取或設置`showOptions` 選項: ``` // getter var showOptions = $( ".selector" ).datepicker( "option", "showOptions" ); // setter $( ".selector" ).datepicker( "option", "showOptions", { direction: "up" } ); ``` ### showOtherMonths**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`是否在當前月份面板顯示上、下兩個月的一些日期數(不可選)。 想要讓這些日期可選,請使用[`selectOtherMonths`](#option-selectOtherMonths)選項。**Code examples:** 初始化帶有指定 `showOtherMonths` 選項的 datepicker: ``` $( ".selector" ).datepicker({ showOtherMonths: true }); ``` 在初始化后,獲取或設置`showOtherMonths` 選項: ``` // getter var showOtherMonths = $( ".selector" ).datepicker( "option", "showOtherMonths" ); // setter $( ".selector" ).datepicker( "option", "showOtherMonths", true ); ``` ### showWeek**Type:** [Boolean](http://api.jquery.com/Types/#Boolean) **Default:** `false`如果為`true`,面板將增加一列,顯示一年中的哪一周。 ?該[`calculateWeek`](#option-calculateWeek)選項決定一年中的哪一周是如何計算的。 您可以改變 [`firstDay`](#option-firstDay)選項。**Code examples:** 初始化帶有指定 `showWeek` 選項的 datepicker: ``` $( ".selector" ).datepicker({ showWeek: true }); ``` 在初始化后,獲取或設置`showWeek` 選項: ``` // getter var showWeek = $( ".selector" ).datepicker( "option", "showWeek" ); // setter $( ".selector" ).datepicker( "option", "showWeek", true ); ``` ### stepMonths**Type:** [Number](http://api.jquery.com/Types/#Number) **Default:** `1`當點擊上/下一月鏈接時,一次翻幾個月。**Code examples:** 初始化帶有指定 `stepMonths` 選項的 datepicker: ``` $( ".selector" ).datepicker({ stepMonths: 3 }); ``` 在初始化后,獲取或設置`stepMonths` 選項: ``` // getter var stepMonths = $( ".selector" ).datepicker( "option", "stepMonths" ); // setter $( ".selector" ).datepicker( "option", "stepMonths", 3 ); ``` ### weekHeader**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"Wk"`本年度哪一周 列的標題顯示文本。 使用[`showWeek`](#option-showWeek)選項以顯示此列。**Code examples:** 初始化帶有指定 `weekHeader` 選項的 datepicker: ``` $( ".selector" ).datepicker({ weekHeader: "W" }); ``` 在初始化后,獲取或設置`weekHeader` 選項: ``` // getter var weekHeader = $( ".selector" ).datepicker( "option", "weekHeader" ); // setter $( ".selector" ).datepicker( "option", "weekHeader", "W" ); ``` ### yearRange**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `"c-10:c+10"`控制年份的下拉列表中顯示的年份數量,可以是相對當前年(-nn:+nn),相對于選擇年份(-nn:+nn),也可以是絕對值(`"nnnn:nnnn"`),或這些格式的組合 (`"nnnn:-nn"`)。 請注意,此選項僅影響下拉列表中的顯示, 使用[`minDate`](#option-minDate) 和/或 [`maxDate`](#option-maxDate)選項限制哪些日期可以選擇。**Code examples:** 初始化帶有指定 `yearRange` 選項的 datepicker: ``` $( ".selector" ).datepicker({ yearRange: "2002:2012" }); ``` 在初始化后,獲取或設置`yearRange` 選項: ``` // getter var yearRange = $( ".selector" ).datepicker( "option", "yearRange" ); // setter $( ".selector" ).datepicker( "option", "yearRange", "2002:2012" ); ``` ### yearSuffix**Type:** [String](http://api.jquery.com/Types/#String) **Default:** `""`顯示在月份頭部中年份后面的文本。**Code examples:** 初始化帶有指定 `yearSuffix` 選項的 datepicker: ``` $( ".selector" ).datepicker({ yearSuffix: "CE" }); ``` 在初始化后,獲取或設置`yearSuffix` 選項: ``` // getter var yearSuffix = $( ".selector" ).datepicker( "option", "yearSuffix" ); // setter $( ".selector" ).datepicker( "option", "yearSuffix", "CE" ); ``` ## Methods ### destroy()Returns: [jQuery](http://api.jquery.com/Types/#jQuery) ([plugin only](http://learn.jquery.com/jquery-ui/widget-factory/widget-method-invocation/)) 完全移除datepicker功能. 這將使元素返回到之前的初始化狀態. * 該方法不接受任何參數。 **Code examples:** 調用 destroy 方法: ``` $( ".selector" ).datepicker( "destroy" ); ``` ### dialog( date [, onSelect ] [, settings ] [, pos ] )Returns: [jQuery](http://api.jquery.com/Types/#jQuery) ([plugin only](http://learn.jquery.com/jquery-ui/widget-factory/widget-method-invocation/)) 在一個"dialog"中打開一個datepicker。 * **date**Type: [String](http://api.jquery.com/Types/#String) or [Date](http://api.jquery.com/Types/#Date)初始化的日期。 * **onSelect**Type: [Function](http://api.jquery.com/Types/#Function)()當一個日期被選中時的回調函數. 這個函數接收日期文本 和datepicker實例作為參數。 * **settings**Type: [Options](http://api.jquery.com/Types/#Options)新的datepicker的選項。 * **pos**Type: [Number[2] or MouseEvent](http://api.jquery.com/Types/#Number%5B2%5D%20or%20MouseEvent)dialog對話框的top/left的`[x, y]`坐標,或者一個鼠標事件`MouseEvent`的坐標。如果不提供此參數dialog將顯示在屏幕正中。 **Code examples:** 調用 dialog 方法: ``` $( ".selector" ).datepicker( "dialog", "10/12/2012" ); ``` ### getDate()Returns: [Date](http://api.jquery.com/Types/#Date) 返回一個datepicker中當前日期, 如果沒有日期被選中的話那么返回`null`。 * 該方法不接受任何參數。 **Code examples:** 調用 getDate 方法: ``` var currentDate = $( ".selector" ).datepicker( "getDate" ); ``` ### hide()Returns: [jQuery](http://api.jquery.com/Types/#jQuery) ([plugin only](http://learn.jquery.com/jquery-ui/widget-factory/widget-method-invocation/)) 關閉先前打開的date picker。 * 該方法不接受任何參數。 **Code examples:** 調用 hide 方法: ``` $( ".selector" ).datepicker( "hide" ); ``` ### isDisabled()Returns: [Boolean](http://api.jquery.com/Types/#Boolean) 確定一個datepicker是否已禁用. * 該方法不接受任何參數。 **Code examples:** 調用 isDisabled 方法: ``` var isDisabled = $( ".selector" ).datepicker( "isDisabled" ); ``` ### option( optionName )Returns: [Object](http://api.jquery.com/Types/#Object) 獲取當前與指定的 `optionName` 關聯的值。 * **optionName**Type: [String](http://api.jquery.com/Types/#String)要獲取值的選項的名稱。 **Code examples:** 調用該方法: ``` var isDisabled = $( ".selector" ).datepicker( "option", "disabled" ); ``` ### option()Returns: [PlainObject](http://api.jquery.com/Types/#PlainObject) 獲取一個包含鍵/值對的對象,鍵/值對表示當前 datepicker 選項哈希。 * 該方法不接受任何參數。 **Code examples:** 調用該方法: ``` var options = $( ".selector" ).datepicker( "option" ); ``` ### option( optionName, value )Returns: [jQuery](http://api.jquery.com/Types/#jQuery) ([plugin only](http://learn.jquery.com/jquery-ui/widget-factory/widget-method-invocation/)) 設置與指定的 `optionName` 關聯的 datepicker 選項的值。 * **optionName**Type: [String](http://api.jquery.com/Types/#String)要設置的選項的名稱。 * **value**Type: [Object](http://api.jquery.com/Types/#Object)要為選項設置的值。 **Code examples:** 調用該方法: ``` $( ".selector" ).datepicker( "option", "disabled", true ); ``` ### option( options )Returns: [jQuery](http://api.jquery.com/Types/#jQuery) ([plugin only](http://learn.jquery.com/jquery-ui/widget-factory/widget-method-invocation/)) 為 datepicker 設置一個或多個選項。 * **options**Type: [Object](http://api.jquery.com/Types/#Object)要設置的 option-value 對。 **Code examples:** 調用該方法: ``` $( ".selector" ).datepicker( "option", { disabled: true } ); ``` ### refresh()Returns: [jQuery](http://api.jquery.com/Types/#jQuery) ([plugin only](http://learn.jquery.com/jquery-ui/widget-factory/widget-method-invocation/)) 在作出一些外部修改后,重繪日期選擇器。 * 該方法不接受任何參數。 **Code examples:** 調用 refresh 方法: ``` $( ".selector" ).datepicker( "refresh" ); ``` ### setDate( date )Returns: [jQuery](http://api.jquery.com/Types/#jQuery) ([plugin only](http://learn.jquery.com/jquery-ui/widget-factory/widget-method-invocation/)) 為datepicker設置日期。 新的日期可能是一個`Date`對象或當前[date format](#option-dateFormat) 的字符串(例如,`"01/26/2009"`), 一個從今天開始的天數(例如,`+7`) 或值和周期的字符串 `"y"` 表示年數, `"m"` 表示月份數, `"w"` 表示周數, `"d"`表示天數,例如, `"+1m +7d"`), ?或者為`null`來清除選定的日期。 * **date**Type: [String](http://api.jquery.com/Types/#String) or [Date](http://api.jquery.com/Types/#Date)新的日期。 **Code examples:** 調用 setDate 方法: ``` $( ".selector" ).datepicker( "setDate", "10/12/2012" ); ``` ### show()Returns: [jQuery](http://api.jquery.com/Types/#jQuery) ([plugin only](http://learn.jquery.com/jquery-ui/widget-factory/widget-method-invocation/)) 顯示日期datepicker插件。 如果datepicker被綁定到input元素, 要顯示datepicker的input元素必須是可見的。 * 該方法不接受任何參數。 **Code examples:** 調用 show 方法: ``` $( ".selector" ).datepicker( "show" ); ``` ### widget()Returns: [jQuery](http://api.jquery.com/Types/#jQuery) 返回一個包含 datepicker 的 `jQuery` 對象。 * 該方法不接受任何參數。 **Code examples:** 調用 widget 方法: ``` var widget = $( ".selector" ).datepicker( "widget" ); ``` ## Example: #### 一個簡單的 jQuery UI Datepicker. ``` <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>datepicker demo</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> </head> <body> <div id="datepicker"></div> <script> $( "#datepicker" ).datepicker(); </script> </body> </html> ```
                  <ruby id="bdb3f"></ruby>

                  <p id="bdb3f"><cite id="bdb3f"></cite></p>

                    <p id="bdb3f"><cite id="bdb3f"><th id="bdb3f"></th></cite></p><p id="bdb3f"></p>
                      <p id="bdb3f"><cite id="bdb3f"></cite></p>

                        <pre id="bdb3f"></pre>
                        <pre id="bdb3f"><del id="bdb3f"><thead id="bdb3f"></thead></del></pre>

                        <ruby id="bdb3f"><mark id="bdb3f"></mark></ruby><ruby id="bdb3f"></ruby>
                        <pre id="bdb3f"><pre id="bdb3f"><mark id="bdb3f"></mark></pre></pre><output id="bdb3f"></output><p id="bdb3f"></p><p id="bdb3f"></p>

                        <pre id="bdb3f"><del id="bdb3f"><progress id="bdb3f"></progress></del></pre>

                              <ruby id="bdb3f"></ruby>

                              哎呀哎呀视频在线观看