こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

コンボボックスの操作

Javascript勉強中のものです。
皆様、宜しくお願いします。

まず画面内に時間のコンボボックスを4つ
もっています。(開始/終了:時/分)
こちらで教えて頂きコンボボックスの値をループで簡単に
書くことが出来ましたが、例えば
開始時間が「17」時であったら、「17」時未満(0~16時まで)の
値(時間)がコンボに表示されないようにさせることは可能ですか?

また、開始コンボ(時)と終了コンボ(時)が同時刻の場合
終了コンボ(分)は、開始コンボ(分)より以前を表示させない
ような制御は可能でしょうか??
コンボの値を変える度にコントロールしたいです。

ややこしい話ですが、どなたか教えて頂けませんか?

//時間のコンボ
Function Cmbhh1(){
 var arrCmb = new Array();
 i = 0;
 for(i = 1; i<25; i++) {
arrCmb[i] = i;
}
return arrCmb;
}
//分のコンボ(15分単位)
Function Cmbmm1(){
 var arrCmb = new Array();
  arrCmb[0] = 0;
  i = 0;
  for(i = 0; i<56; i++) {
   arrCmb[i] = i;
   i = i + 4;
   }
return arrCmb;
}

投稿日時 - 2008-03-08 02:06:47

QNo.3842946

すぐに回答ほしいです

質問者が選んだベストアンサー

前回の件が見つかりませんでしたので、分からないところは付け加えてみます。

・ 開始時間を選択したら、開始の分は0に戻す。

・ 終了時間を選択したとき、開始時間より大きいときは終了の分を0に戻す。


以下のコードを参考にしてみてください。

-------------------------------------------------------------------------------
<html>
<head>
<title>calendar</title>
<script language="JavaScript" type="text/javascript">
<!--

function setMonths(n,start){
 var st = 0;
if (typeof start == "string") st=start;
if (typeof n == "string") n=document.getElementById(n);

n.options.length=0;
  var len=0;
for(var i=st ; i<24; i++) {
n.options[len++]=new Option(i, i);
}
}

function selM1(n,start){
setMonths("months2",start);
setDays("days");
}


function setDays(n,start){
 var st = 0;
if (typeof start == "string") st=Number(start);
if (typeof n == "string") n=document.getElementById(n);

n.options.length=0;
var len=0;
 for(var i=st ; i<60; i+=4) {
n.options[len++]=new Option(i, i);
}
}

function selD2(n,start){
if (start==document.getElementById("months").value) {
setDays("days2",document.getElementById("days").value);
} else {
setDays("days2",0);
}
}

window.onload = function() {
setMonths("months");
setMonths("months2");
setDays("days");
setDays("days2","0");
}

//-->
</script>
</head>

<body>
<h3>
コンボボックスの操作
</h3>
開始:<select id="months" onchange="selM1(this,this.value)">
</select>
<select id="days">
</select>
<hr />
終了:<select id="months2" onchange="selD2(this,this.value)">
</select>
<select id="days2">
</select>
</body>
</html>

投稿日時 - 2008-03-08 10:10:40

お礼

>autyさん
アドバイスありがとうございました。
解りやすいように、HTMLも準備して下さり、とても
助かりました。
上記スクリプトを参考にして、詳細を勉強致します。
また機会があったら教えて下さいw

投稿日時 - 2008-03-10 02:50:17

ANo.1

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問