JavaScriptでユーザー入力の時刻をDateオブジェクトにパースする方法は?
2023-11-22 13:31:23
質問
私は、ユーザーがテキスト入力に時刻を入力するためのフォーム ウィジェットに取り組んでいます (カレンダー アプリケーション用)。JavaScript (私たちは jQuery を使用しています) を使用して、ユーザーが入力したテキストを解析する最良の方法を見つけたいのですが、JavaScript の
Date()
オブジェクトにパースして、比較やその他のことを簡単に実行できるようにする最適な方法を見つけたいのです。
を試してみましたが
parse()
メソッドを試してみましたが、私のニーズには少しうるさ過ぎました。私は、以下の例の入力時間(論理的に類似した他の時間形式に加えて)を、同じようにうまくパースできることを期待します。
Date()
オブジェクトとして正常にパースできることを期待します。
- 午後 1 時
- 午後 1 時
- 1:00 p
- 午後1:00
- 午後 1 時
- 1:00p
- 午後 1 時
- 午後1時
- 1 p
- 午後1時
- 午後1時
- 1p
- 13:00
- 13
私は、正規表現を使って入力を分割し、使いたい情報を抽出して、自分の
Date()
オブジェクトを作成するために使用したい情報を抽出しようと考えています。これを行うための最良の方法は何でしょうか?
どのように解決するのですか?
指定した入力に対して動作する簡単な解決方法です。
function parseTime( t ) {
var d = new Date();
var time = t.match( /(\d+)(?::(\d\d))?\s*(p?)/ );
d.setHours( parseInt( time[1]) + (time[3] ? 12 : 0) );
d.setMinutes( parseInt( time[2]) || 0 );
return d;
}
var tests = [
'1:00 pm','1:00 p.m.','1:00 p','1:00pm','1:00p.m.','1:00p','1 pm',
'1 p.m.','1 p','1pm','1p.m.', '1p', '13:00','13', '1a', '12', '12a', '12p', '12am', '12pm', '2400am', '2400pm', '2400',
'1000', '100', '123', '2459', '2359', '2359am', '1100', '123p',
'1234', '1', '9', '99', '999', '9999', '99999', '0000', '0011', '-1', 'mioaw' ];
for ( var i = 0; i < tests.length; i++ ) {
console.log( tests[i].padStart( 9, ' ' ) + " = " + parseTime(tests[i]) );
}
他のいくつかの品種でも同様に動作するはずです (例えば a.m. が使用されていても動作します)。明らかにこれはかなり粗雑ですが、かなり軽量でもあります (たとえば、完全なライブラリよりもこれを使用する方がはるかに安価です)。
警告。このコードは 12:00 AM などでは動作しません。
関連
-
[解決済み] JavaScriptのオブジェクトが空であることをテストするにはどうすればよいですか?
-
[解決済み] 配列に特定のインデックスで項目を挿入する方法 (JavaScript)
-
[解決済み] JavaScriptのオブジェクトをループスルーまたは列挙するにはどうすればよいですか?
-
[解決済み] JavaScriptの日付の書式設定方法
-
[解決済み] JavaScriptで現在の日付を取得するには?
-
[解決済み] SQL Server の DateTime データ型から日付だけを返す方法
-
[解決済み] JavaScriptのオブジェクトを表示するにはどうすればよいですか?
-
[解決済み] Androidで現在の時刻と日付を取得する方法
-
[解決済み] node.jsで文字列のsha1ハッシュを取得するにはどうすればよいですか?
-
[解決済み] JavaScriptでjson-objectのキーを取得する [重複].
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] reactのrender関数でdynamic hrefを作成するには?
-
[解決済み] javascript の関数から `undefined` と `null` のどちらを返すのが良いのでしょうか?
-
[解決済み] React js 親コンポーネントから子コンポーネントの状態を変更する
-
[解決済み] JavaScript のオブジェクトの配列を比較し、最小値/最大値を取得する
-
[解決済み] TypeScriptプロジェクトで既存のC#クラス定義を再利用する方法
-
[解決済み] jQueryで入力ファイルが空かどうかをチェックする方法
-
[解決済み] モデルフェッチ時に1をtrueに、0をfalseに変換する方法
-
[解決済み] JavaScriptのArray.sort()メソッドでシャッフルするのは正しいのか?
-
[解決済み] querySelectorAllがない場合、ライブラリを使用せずに属性で要素を取得する?
-
[解決済み] Chrome拡張機能:popup.htmlを強制終了させる