前提・実現したいこと
javascript初心者です。
HTMLで3つのセレクトボックスを設置していて、JavaScriptの”onchange”でvalue値を取得しています。
全てのセレクトボックスを選択し終わったら、「START」という文字を表示させたいのですが、
どのような方法で選択されたかどうかの判別をしたら良いのか分からないので、ご教授いただきたいです。
該当のソースコード
HTML
1 <div id="countBox"> 2 <div id="startBox"></div> 3 </div> 4 <form name="fmname" id="form"> 5 <select name="selBoxA" id="selidA" height="10vh"> 6 <option value="">Count</option> 7 </select> 8 <select name="selBoxB" id="selidB" height="10vh"> 9 <option value="">Set</option> 10 </select> 11 <select name="selBoxC" id="selidC" height="10vh"> 12 <option value="">Interval</option> 13 </select>
Javascript
1selidChangeCount.onchange = function(){ 2 clearInterval(timer_flg); 3 timer_flg = null; 4 selidA = this.options[ this.selectedIndex ]; 5 setCountA = selidA.value; 6 clickCount = setCountA; 7 seting_view_css(); 8 countUp.innerHTML = clickCount; 9 console.log(clickCount); 10 } 11 12 selidChangeSet.onchange = function(){ 13 selidB = this.options[ this.selectedIndex ]; 14 setCountB = selidB.value; 15 console.log(setCountB); 16 } 17 18 selidChangeTime.onchange = function(){ 19 selidC = this.options[ this.selectedIndex ]; 20 setCountC = selidC.value; 21 setCountC = setCountC*100; 22 console.log(setCountC); 23 }
試したこと
Javascript
1//選択されたかどうかのチェック 2 if(setCountA == "" || setCountB == "" || setCountC == ""){ 3 startBox.innerHTML = "選択してください"; 4 }else{ 5 startBox.innerHTML = "START!"; 6 }
補足情報(FW/ツールのバージョンなど)
試した結果、ページを表示させた時はまだ選択していない状態なので、「選択してください」となるところ、「START」の表示になってしまうので判定が正しく動いていないようです。
選択を変更したらvalue値が都度変更されるようにしていて、
セレクトボックス以外に送信ボタンなどは設置していないのですが、チェック用に他に何か設置したほうが良いのでしょうか?
できれば、セレクトボックスのみで実装したいです。
回答3件
あなたの回答
tips
プレビュー