おしえて

現在時刻を取得してフォームのselectのプルダウンで表示させたい

解決済

質問者：まめまめまめまめこ
質問日時：2018/08/10 11:29
回答数：3件

質問2点あります

■１．formのselectでJavaScriptを使って現在時刻を反映させたプルダウンの作り方を教えてください。
■２．プルダウンの表示を現在の時刻から30分間隔で表示させたい。

以上、どなたかご教示いただけるととっても助かります！

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.3ベストアンサー

回答者： babu_babu_baboo
回答日時：2018/08/10 23:38

//動かないときは、あきらめて！

<!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));

</script>

- 1
- 件

通報する

この回答へのお礼

動きました！
本当にありがとうございます！！

通報する

お礼日時：2018/08/16 19:32

No.2

回答者： takanami1000
回答日時：2018/08/10 18:31

とりあえず最低限の仕様でこんな感じに作ってみました。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function getSelectValue(n) {
return("0"+parseInt(n / 2)).substr(-2) + ":" + ("0"+(n * 30 % 60)).substr(-2);
}
</script>
</head>
<body>
<form>
<select>
<script type="text/javascript">
var d = new Date();
var s = d.getHours() * 2 + parseInt(d.getMinutes() / 30);
for(var i = 0; i < 48; i++) {
document.write("<option value="+ getSelectValue((s + i) % 48) +">"+ getSelectValue((s + i) % 48) +"</option>");
}
</script>
</select>
</form>
</body>
</html>