My97DatePicker は非常に柔軟で使いやすい日付コントロールです。使い方はとても簡単です。 1. My97DatePickerコンポーネントパッケージをダウンロードするダウンロードアドレス: https://www.jb51.net/jiaoben/18012.html 2. コンポーネント js ファイルをページに導入します。<script type="text/JavaScript" src="My97DatePicker/WdatePicker.js"></script> 3. 例<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <ヘッド> <title>My97DatePicker 日付コントロールの使用</title> </head> <本文> <中央> <h2>My97DatePicker 日付コントロールの使用</h2> </center> 基本的な使い方: <input id="" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true})" /><br><br> 今日より前の日付のみ選択できます: <input id="" class="Wdate" onfocus="WdatePicker({readOnly:true,maxDate:'%y-%M-%d'})" /><br><br> 演算式を使用して、20 時間前から 30 時間後までの日付のみを選択します<input id="" class="Wdate" onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',minDate:'%y-%M-%d {%H-20}:%m:%s',maxDate:'%y-%M-%d {%H+30}:%m:%s'})" /><br><br> 開始日と終了日: <!-- $dp.$ は document.getElementById 関数と同等です。 --> <input id="sdate" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true,maxDate:'#F{$dp.$D(\'edate\')}'})" /> - <input id="edate" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true,minDate:'#F{$dp.$D(\'sdate\')}',startDate:'#F{$dp.$D(\'sdate\',{d:+1})}'})" /><br><br> </本文> <script type="text/javascript" src="/js/My97DatePicker/WdatePicker.js"></script> </html> 構成情報を変更する必要がある場合は、関連する構成情報 4. よく使用される構成情報。構成情報は主に、onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true})" の WdatePicker メソッドの { } オブジェクトで定義されます。 よく使用される構成情報は、WdatePicker.js ファイルで定義されます。 var $dp,WdatePicker;(function(){var _={ $wdate:true、 $dpPath:"", $クロスフレーム:true, doubleCalendar:false, // 隔月カレンダーかどうか autoUpdateOnChanged:false, position:{}, //位置の例: position:{left:100,top:50} lang:"自動", skin:"default", //スキン dateFmt:"yyyy-MM-dd", //日付形式 realDateFmt:"yyyy-MM-dd", リアルタイムフォーマット:"HH:mm:ss", realFullFmt:"%Date %Time", minDate:"1900-01-01 00:00:00", //最小日付 maxDate:"2099-12-31 23:59:59", //最大日付 startDate:"", //開始日 alwaysUseStartDate:false, //日付ボックスが任意の値の場合、常に開始日として startDate を使用します yearOffset:1911, firstDayOfWeek:0, //週の最初の曜日をカスタマイズisShowWeek:false, //平日を表示highLineWeekDay:true, //日曜日を強調表示isShowClear:true, //クリアを表示isShowToday:true, //今日を表示isShowOK:true, //OKを表示 isShowOthers:true、 readOnly:false, //読み取り専用ですか? qsEnabled:true, errDealMode:0, //自動エラー修正機能//0 間違った日付を入力すると、最初にプロンプトが表示されます//1 間違った日付を入力すると、以前の正しい値が自動的に復元されます//2 間違った日付を入力すると、プロンプトも変更も表示されず、マークのみが付けられますが、日付ボックスはすぐには非表示になりません autoPickDate:null, //日付を選択するために 2 回クリックする理由//false の場合、日付をクリックしても日付は自動的に入力されず、確認して入力する必要があります//true の場合、日付をクリックすると日付の値を返すことができます//null (推奨) の場合、時間がある場合は false に設定し、そうでない場合は true に設定します specialDates:null, //特別な日 specialDays:null, //特別な日 disabledDates:null, //無効な日付、例: disabledDates:['5$'] disabledDays:null, //無効な日: disabledDays:[6] opposite:false, //有効な日付 これで、JS 日付コントロール My97DatePicker の基本的な使用法に関するこの記事は終了です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援して頂ければ幸いです。 以下もご興味があるかもしれません:
|
>>: Docker を使用して開発環境を構築する方法 (Windows および Mac)
コードをコピーコードは次のとおりです。 <div contenteditable="...
この記事では、MySQL 8.0.16 winx64のインストールと設定の具体的な方法を記載します。...
1. スクロールスナップはフロントエンド開発者にとって必須のスキルですCSS スクロール スナップは...
Vmvare が仮想マシンのディスク サイズを設定した後、ディスク領域が不足していることがわかりまし...
MySQLデータベースの保存場所: 1. MySQLがMyISAMストレージエンジンを使用する場合...
オーバーレイネットワーク分析組み込みのホスト間ネットワーク通信は、常に Docker の待望の機能で...
1. 永久的な変更、すべてのユーザーに有効# vi /etc/プロファイル//キーボードの[Shi...
この記事では、アコーディオンを実装するためのjQueryの具体的なコードを参考までに紹介します。具体...
1. getBoundingClientRect() 分析getBoundingClientRect...
この記事では、:placeholder-shown 疑似クラスを使用して、純粋な CSS で浮動疑問...
この質問は、MySQL の権限に関する WeChat グループのネットユーザー間の議論です。次のよう...
キーボードで文字を入力すると、対応するプロセスにどのように送信されるのでしょうか? ps や who...
IE6 で CSS スタイルの div または li の背景のタイリングや境界の破壊を解決するには、...
この記事では、参考までにMYSQLログとバックアップとリストアについて紹介します。具体的な内容は以下...
Linux でバージョン情報を表示する方法。ビット数、バージョン情報、CPU コア情報、CPU 固有...