My97DatePicker の日付範囲制限_html/css_WEB-ITnose-htmlチュートリアル-php.cn

My97DatePicker の日付範囲制限_html/css_WEB-ITnose

WBOY

リリース： 2016-06-24 11:24:51

オリジナル

1367 人が閲覧しました

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. スクリプトのカスタマイズの制限:

システムは、日付操作を支援する 2 つの API、$dp.$D と $dp.$DV を提供します。さらに、#F{} Custom を入力することもできます。スクリプトを使用して、日付制限付きでやりたいことを何でも実行できます。

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) 正規表現に精通している限り、この関数を使用して 1 つ以上の指定された日付を無効にすることができます。

使用法 (正規のマッチング): 正規表現に慣れている場合は、次のマッチングの使用法を簡単に理解できます。詳しくない場合は、次の一般的な例を参照してください:

['2010-01-01' ,'2010-02 -02'] は、2010-01-01 と 2010-02-02 を無効にすることを意味します。
['2010-..-01','2010-02-02'] は、2010-all months-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 と組み合わせて使用すると、非常に要求の厳しい状況でもニーズを満たすことができます。 6) 前の 1 時間と次の 1 時間のすべての時間を無効にします。%y %M %d %H %m %s などの変数を使用します。

<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]})"/>

ログイン後にコピー

7) #F{} を使用して、0 ～ 23 の任意の時間をランダムに無効にすることもできます。時間選択ボックスを開くと、1 時間が無効になり、それぞれの無効な時間が異なることがわかります。

<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}\:..\:..']})"/>

ログイン後にコピー

. 有効な日付:

無効な日付を使用すると、利用できない日付を簡単に無効にできますが、少数の日付のみを有効にする必要がある場合には、有効な日付関数が非常に適しています。

キー属性: 反対デフォルトは false です。true の場合、この属性は無効な日と特別な日には影響しません。

1) 毎月 5 日、15 日、25 日のみを有効にします。

リーリー 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']})"/>

ログイン後にコピー

形式	説明