My97DatePicker日期範圍限制

来源:http://www.cnblogs.com/wp5719/archive/2016/03/09/5257088.html
-Advertisement-
Play Games

My97DatePicker日期範圍限制 1.動態時間範圍限制: 1)只能選擇今天以前的日期(包含今天)。 <input type="text" class="Wdate" id="occurDate" onfocus="WdatePicker({skin:'whyGreen',dateFmt: '


  1.動態時間範圍限制:

    可以通過系統給出的動態變數,如%y(當前年),%M(當前月)等來限制日期範圍,還可以通過{}進行表達式運算,如:{%d+1}:表示明天。

格式 說明
%y  當前年
%M  當前月
%d  當前日
%ld 本月最後一天
%H  當前時
%m 當前分
%s  當前秒
{} 運算表達式, 如:{%d+1}: 表示明天
#F{} {}之間是函數可寫自定義JS代碼

 

     1)只能選擇今以前的日期(包含今天)。

<input type="text" class="Wdate" id="occurDate" onfocus="WdatePicker({skin:'whyGreen',dateFmt: 'yyyy-MM-dd', maxDate:'%y-%M-%d', readOnly:true})" value = "${occurdate}" style="background-color:#e4e4e4;; height:65%; width:100%"></input>

       2) 只能選擇今天以後的日期(不包含今天),使用運算表達式。

<input type="text" class="Wdate" id="occurDate" onfocus="WdatePicker({skin:'whyGreen',dateFmt: 'yyyy-MM-dd', minDate:'%y-%M-{%d+1}', readOnly:true})" value = "${occurdate}" style="background-color:#e4e4e4;; height:65%; width:100%"></input>

       3) 只能選擇本月日期1號到本月最後一天的日期。

<input type="text" class="Wdate" id="occurDate" onfocus="WdatePicker({skin:'whyGreen',dateFmt: 'yyyy-MM-dd', minDate:'%y-%M-01',maxDate:'%y-%M-%ld', readOnly:true})" value = "${occurdate}" style="background-color:#e4e4e4;; height:65%; width:100%"></input>

      4) 只能選擇今天8:00:00至明天12:00:00的日期。

<input id="occurDate" class="Wdate" type="text" onfocus="WdatePicker({dateFmt:'yyyy-M-d H:mm:ss',minDate:'%y-%M-%d 8:00:00',maxDate:'%y-%M-{%d+1} 12:00:00'})"/>

      5) 只能選擇10小時前至50小時後的日期。

<input id="occurDate" class="Wdate" type="text" onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',minDate:'%y-%M-%d {%H-10}:%m:%s',maxDate:'%y-%M-%d {%H+50}:%m:%s'})"/>

    2.腳本自定義限制:

       系統提供了$dp.$D和$dp.$DV這兩個API來輔助進行日期運算,此外還可以通過在 #F{} 中填入自定義的腳本,做任何你想做的日期限制 。

     1) 前面的日期不能大於後面的日期且兩個日期都不能大於當前年的最後一天。

<input id="date1" class="Wdate" type="text" onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'date2\')||\''%y-12-31\'}'})"/> 
<input id="date2" class="Wdate" type="text" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'date1\')}',maxDate:'%y-12-31'})"/>

       2) 前面的日期+5天,不能大於後面的日期。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'date2\',{d:-5});}'})"/> 
<input id="date2" type="text" class="Wdate" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'date1\',{d:5});}'})"/>

       3) 前面的日期+2月零6天,不能大於後面的日期且前面日期都不能大於 2020-6-6減去2月零6天,後面日期不能大於2020-6-6。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'date2\',{M:-2,d:-6})||$dp.$DV(\'2020-6-6\',{M:-2,d:-6})}'})"/> 
<input  id="d4332" type="text" class="Wdate" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'date1\',{M:2,d:6});}',maxDate:'2020-6-6'})"/>

    3.無效天限制:

      1) 可以使用此功能禁用周日至周六所對應的日期,相關屬性:disabledDays (0至6 分別代表周日至周六) 。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({disabledDays:[6]})"/>

       2) 禁用周六,周日所對應的日期。

<input id="date2" type="text" class="Wdate" onFocus="WdatePicker({disabledDays:[0,6]})"/>

    4.無效日期限制:

   1)可以使用此功能禁用所指定的一個或多個日期,只要熟悉正則表達式。

      用法(正則匹配):  如果你熟悉正則表達式,會很容易理解下麵的匹配用法;如果不熟悉,可以參考下麵的常用示例 :

      ['2010-01-01','2010-02-02'] 表示禁用 2010-01-01 和 2010-02-02。
      ['2010-..-01','2010-02-02'] 表示禁用 2010-所有月份-01 和 2010-02-02。
      ['200[0-9]]-02-01','2010-02-10'] 表示禁用 [2000至2009]-02-01 和 2010-02-10。
      ['^2010'] 表示禁用 2010年的所有日期。

 

      此外,還可以使用 %y %M %d %H %m %s 等變數,用法同動態日期限制。註意:%ld不能使用。
      ['....-..-01','%y-%M-%d'] 表示禁用所有年份和所有月份的第一天和今天。
      ['%y-%M-{%d-1}','%y-%M-{%d+1}'] 表示禁用昨天和明天。

 

      當然,除了可以限制日期以外,還可以限制時間:
      ['....-..-.. 11\:00\:00'] 表示禁用每天11點 (註意 : 需要使用 \: ) 。

    2) 禁用每個月份的5日15日25日。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({disabledDates:['5$']})"/> 

     註意 :'5$' 表示以5結尾,註意 $ 的用法。

   3)禁用所有早於2000-01-01的日期。

 

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({disabledDates:['^19']})"/> 

 

     註意: '^19' 表示以19 開頭,註意 ^ 的用法 。

   4)配合min/maxDate使用,可以把可選擇的日期分隔成多段。

<input id="date3" type="text" class="Wdate" onFocus="WdatePicker({minDate:'%y-%M-01',maxDate:'%y-%M-%ld',disabledDates:['0[4-7]$','1[1-5]$','2[58]$']})"/>

    5) min/maxDate disabledDays disabledDates 配合使用,即使在要求非常苛刻的情況下也能滿足需求。

 

<input id="date4" type="text" class="Wdate" onFocus="WdatePicker({minDate:'%y-%M-01',maxDate:'%y-%M-%ld',disabledDates:['0[4-7]$','1[1-5]$','2[58]$'],disabledDays:[1,3,6]})"/>

 

    6) 禁用前一個小時和後一個小時內所有時間,使用 %y %M %d %H %m %s 等變數。

<input id="date5" type="text" class="Wdate" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',disabledDates:['%y-%M-%d {%H-1}\:..\:..','%y-%M-%d {%H+1}\:..\:..']})"/>

    7) #F{}也是可以使用的,利用自定義函數隨機禁用0-23中的任何一個小時,打開小時選擇框,發現有一個小時被禁用,而且每次禁用的小時都不同。

<script> 
   function randomH(){ 
  //產生一個隨機的數字 0-23 
  var H = Math.round(Math.random() * 23); 
  if(H<10) H='0'+H; 
      //返回 '^' + 數字 
      return '^'+H; 
    } 
</script> 

<input type="text" class="Wdate" id="date5" onFocus="WdatePicker({dateFmt:'HH:mm:ss',disabledDates:['#F{randomH()}']})"/>

  5.有效日期:

  使用無效日期可以很方便的禁用不可用的日期,但是在只需要啟用少部分日期的情況下,有效日期的功能就非常適合了。

   關鍵屬性: opposite 預設為false, 為true時,無效日期變成有效日期,該屬性對無效天,特殊天不起作用 。

    1) 只啟用每個月份的 5日 15日 25日。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({opposite:true,disabledDates:['5$']})"/> 

  6.特殊天和特殊日期:

     特殊天和特殊日期的用法跟完全無效天和無效日期完全相同,但是opposite屬性對其無效。

    關鍵屬性:

       specialDays (0至6 分別代表 周日至周六) 用法同無效天。

       specialDates 用法同無效日期,但是對時分秒無效。

      1) 高亮每周 周一 周五。

<input id="date1" type="text" class="Wdate" onFocus="WdatePicker({specialDays:[1,5]})"/>

      2) 高亮每月 1號 15號。

<input id="date2" type="text" class="Wdate" onFocus="WdatePicker({specialDates:['....-..-01','....-..-15']})"/>

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 前言: 在寫CSS的時候讓元素在高度固定的容器中垂直居中是很簡單的,譬如設置容器的padding或者元素的margin之類的都可以做到;讓元素在容器中水平居中也有text-align:center、margin:0 auto;之類的屬性來幫我們達到目的,但是如何讓元素在不確定高度的容器中垂直居中或者
  • 在回覆或是評論的時候,很多時間都需要有回覆表情的功能,然後而需要插入QQ表情可以是最常見的。 插件也寫多很多個了,這次寫插件就下了一個決定。就是使用模塊化來開發。 最後在我的源代碼中有這樣子一段: var css = require('./css.css'); //創建css var arr = r
  • 一.JS (1) 在函數中賦值,多次賦值,出現問題 var a = b = c = 10; console.log(delete a); //false console.log(delete b); //true console.log(delete c); //true function fn()
  • http://www.kwstu.com/Admin/ViewArticle/201409011604277330
  • 一. 當初為什麼選擇chart.js 當初項目使用庫是Zepto,Zepto能支持的chart處理庫太少。也是為了使得項目比較輕量化,所以選擇了chart.js。 但是最後的顯示結果實在太差,放棄了char.js,還是使用jquery+highstock來完成chart需求。 總而言之,項目的cha
  • 學習要點: 1.傳統事件綁定的問題2.W3C事件處理函數3.IE事件處理函數4.事件對象的其他補充 事件綁定分為兩種:一種是傳統事件綁定(內聯模型,腳本模型),一種是現代事件綁定(DOM2級模型)。現代事件綁定在傳統綁定上提供了更強大更方便的功能。 一 傳統事件綁定的問題 傳統事件綁定中的內聯模型不
  • 什麼是 AJAX ? AJAX = 非同步 JavaScript 和 XML。 AJAX 不是新的編程語言,而是一種使用現有標準的新方法 AJAX 是一種用於創建快速動態網頁的技術。 通過在後臺與伺服器進行少量數據交換,AJAX 可以使網頁實現非同步更新。這意味著可以在不重新載入整個網頁的情況下,對網頁
  • 一. gulp和grunt對比 grunt目前的工作流程:讀文件、修改文件、寫文件——讀文件、修改文件、寫文件——... gulp目前的工作流程:讀取文件——修改文件——修改文件...——寫文件 二. grunt存在問題 1、插件職能不夠單一 2、插件完成了本不該由插件完成的事情(這個我有點迷糊,為
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...