WdatePicker とはどのようなプラグインですか?

WdatePicker とはどのようなプラグインですか?

WdatePicker は、スキンをカスタマイズし、現在の日付を表示し、過去の記録に基づいて日付をすばやく選択できる強力な JS カレンダー プラグインで、最大 2099 の日付をサポートします。最低 1904 や、さまざまな機能を備えたその他の JS 日付選択プラグイン - WdatePicker.js。

ニーズに応じてさまざまなパラメータを設定して、さまざまな効果を実現できます。

日付プラグイン WdatePicker.js の使い方

最も簡単な設定方法：

(1) WdatePicker.js (lang を含む) をダウンロードしますおよびスキンフォルダー)。

(2) WdatePicker.js および WdatePicker.css ファイルを HTML ページにインポートします

(3)

コードを入力ボックスの入力要素に追加します。 class="Wdate" onFocus="WdatePicker({lang:'zh-cn'})"

(4) ページを開いて効果を確認します。

class="Wdate" の目的は、クラスを追加するときに、図に示すように小さな時間アイコンが表示されることです。

詳細使用法

1) コントロールの設定はありません

<input class="Wdate" type="text" onfocus="WdatePicker()"/>

2) 2017-08-15 から 2018-08-15 までの制限された日付範囲

<input id="d411" class="Wdate" type="text" onfocus="WdatePicker({minDate: &#39;2017-08-15&#39;, maxDate: &#39;2018-08-15&#39; })"/>

3) 制限された時間範囲は 2018-07-15 10:30:00 ～ 2018-08-15 11:30:00

<input type="text" class="Wdate" onfocus="WdatePicker({dateFmt: &#39;yyyy-MM-dd HH:mm:ss&#39;,minDate: &#39;2017-08-15 10:30:00&#39;, maxDate: &#39;2018-08-15 11:30:00&#39; })" value="2018-08-15 10:30:00"/>

4) 制限された日付範囲は 2018 年 7 月から 2018 年 8 月です

<input type="text" class="Wdate"  onfocus="WdatePicker({dateFmt: &#39;yyyy年M月&#39;, minDate: &#39;2018-7&#39;, maxDate: &#39;2018-8&#39; })"/>

5) 制限時間の範囲は 8:00:00 から 11:30:00

<input type="text" class="Wdate"  onfocus="WdatePicker({dateFmt: &#39;H:mm:ss&#39;, minDate: &#39;8:00:00&#39;, maxDate: &#39;11:30:00&#39; })"/>

6) 選択できるのは今日より前の日付のみです。

<input class="Wdate" type="text" onfocus="WdatePicker({maxDate: &#39;%y-%M-%d&#39; })"/>

7) 今日以降の日付のみ選択できます (今日を除く)

<input class="Wdate" type="text" onfocus="WdatePicker({minDate: &#39;%y-%M-#{%d+1}&#39; })"/>

8) 今月の日付のみ選択できます。 > 9) 今日の 7:00:00 から明日の 21:00:00 までのみ

<input class="Wdate" type="text" onfocus="WdatePicker({minDate: &#39;%y-%M-01&#39;, maxDate: &#39;%y-%M-%ld&#39; })"/>

10) 20 時間前から 30 時間後までのみ

<input  class="Wdate" type="text"onfocus="WdatePicker({dateFmt:&#39;yyyy-M-d H:mm:ss&#39;,minDate: &#39;%y-%M-%d 7:00:00&#39;, maxDate: &#39;%y-%M-#{%d+1} 21:00:00&#39; })"/>

11 ) .前の日付は次の日付より大きくすることはできません

<input  class="Wdate" type="text" onClick="WdatePicker({dateFmt:&#39;yyyy-MM-dd HH:mm&#39;,minDate: &#39;%y-%M-%d #{%H-20}:%m:%s&#39; ,maxDate: &#39;%y-%M-%d #{%H+30}:%m:%s&#39; })"/>

注: 2 つの日付の形式は、document.getElementById 関数と同じである必要があります。これは、" と ' が周辺機能で使用されているためです。エスケープ文字を使用しないと JS 構文エラーが表示されます。そのため、他の場所で使用する場合は、必ず ' を " または ' に変更してください。 #F{$dp.$D ('myDate_2')||'2020-10-01'} は、myDate_2 が空の場合、2020-10-01 の値が最大値として使用されることを意味します

関連知識の詳細については、

<input id="myDate_1" class="Wdate" type="text" onFocus="WdatePicker({maxDate: &#39;#F{$dp.$D(\&#39;myDate_2\&#39;)||\&#39;2020-10-01\&#39;}&#39; })"/>
<input id="myDate_2" class="Wdate" type="text" onFocus="WdatePicker({minDate:&#39;#F{$dp.$D(\&#39;myDate_1\&#39;)}&#39; ,maxDate:&#39;2020-10-01&#39; })"/>

PHP 中国語 Web サイト

をご覧ください。 ！