前回の質問で、「現在時刻を取得してフォームのselectのプルダウンを30分間隔で表示する」ことはできたのですが、
もう一つ同じselectボックスを表示させて開始時間と終了時間で選択できるフォームをつくりたいのですが、どのようにすればいいでしょうか?
どなたかご教示お願いします!
babu_babu_babooさんにご回答していただきました⇩
「現在時刻を取得してフォームのselectのプルダウンを30分間隔で表示する」
<!DOCTYPE html>
<meta charset="UTF-8">
<title>ES2015がすでにあるというのに</title>
<style>
</style>
<body>
<form id="hoge">
<select id="fuga"></select>
</form>
<script>
function* getTime (count = 0, D = new Date, step = 30) {
const
zp = n => ('0' + n ).slice (-2);
while (count--) {
let
H = D.getHours ();
M = D.getMinutes ();
yield [
zp (H),
zp (M)
].join (':');
D.setMinutes (M + step);
}
}
const select = document.querySelector ('#fuga');
//for (let e of select.childNodes) e.remove ();
for (let t of getTime (10))
select.appendChild (new Option (t, t));
以上、よろしくお願いします
A 回答 (2件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
こんばんは
>開始時間と終了時間で選択できるフォームをつくりたいのですが、
>どのようにすればいいでしょうか?
同じものをふたつつくりたいということでしょうか?
1)出来上がったものを後で複製してしまう。
select.parentNode.appendChild (select.cloneNode(true));
ただし、IDも複製されてしまうので、重複しないようにIDを用いずにセレクタをクラス等に変えておく必要があります。
2)空のセレクト要素をもうひとつ用意しておいて(例えばselect2とします)同時に作成してしまう。
同じループのなかで
select2.appendChild (new Option (t, t));
No.2
- 回答日時:
>説明不足で申し訳...
終了時間は、どこまで表示するのか?
ましてや、最初にだれかが指摘していたけれど、日付けが変わったらどうするのか?
などなど。
作成を丸投げするんだから、きっちりと仕様書をかくべき!
回答が付くかは別だけれど。
回答者側もできるだけ汎用性をもたせて書くべきですね。
方法3)
for (let t of getTime (10,今から30分後のDateオブジェクト))
このヒントで動かせないのならあきらめて!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
- JavaScript 中百舌鳥駅と深井駅を入れ替えて選択しても同じ挙動にしたいです。 2 2022/06/24 18:45
- JavaScript 1度きりではなく、繰り返し、挙動が変わるようにしていただきたいです。 1 2022/07/03 15:50
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript 電車の運賃を出すプログラムを作っています。 2 2022/06/22 09:36
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
プルダウン 項目が多いので先頭...
-
Selectボックスの幅を自動で広...
-
CSVファイルを読みこみ、プルダ...
-
jQuery セレクトボックスで選択...
-
html selectの内容を初期値に戻す
-
jspに組込んだJavaScript でjava文
-
Selectの中身をfor文で入れる
-
プルダウンで現在の年月日を取...
-
セレクトメニューの連動 multip...
-
セレクトの値を取得できない
-
selectタグに直接onChangeを書...
-
ラジオボタンとドロップダウン...
-
<textarea>にプルダウンを表示...
-
現在時刻を取得してフォームのs...
-
セレクトボックスで現在選択さ...
-
セレクトを全て選択されていな...
-
JQuery selectが反映されない
-
HTMLコンボボックスへの項目追加
-
return trueとreturn falseの用...
-
submitボタン押下時にPOSTされ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
プルダウン 項目が多いので先頭...
-
Selectボックスの幅を自動で広...
-
Selectの中身をfor文で入れる
-
html selectの内容を初期値に戻す
-
CSVファイルを読みこみ、プルダ...
-
セレクトを全て選択されていな...
-
ブラウザの戻るボタンを押した...
-
JQuery selectが反映されない
-
jQuery セレクトボックスで選択...
-
セレクトの値を取得できない
-
テーブルにおける行(セルにプル...
-
現在時刻を取得してフォームのs...
-
javascriptでの2つのプルダウン...
-
document.form で nullまたは...
-
リストボックスの項目の順番を...
-
onFocusOutが複数回呼ばれる!
-
javascriptでselectボックスの<...
-
プログラムがうまく動きません...
-
親子連動型のselectを設置し、...
-
selectタグに直接onChangeを書...
おすすめ情報
ご回答有難うございます。
説明不足で申し訳ありません。
開始時間と終了時間のセレクトがあり、
終了時間のセレクトは、開始時間の選択した時間から30分間隔で表示したいです。
開始時間のセレクトは作成できたので、終了時間のセレクトの作成方法を教えていただけないでしょうか。
どうぞよろしくお願いします!!!