プログレスパーの値の変更

プログレスパーの値の変更
プログレスパーを使い、予約状況がみれるようにする
これなら視覚的にわかりやすくなる
ちなみに、、応用すればゲームでHPが減るのをみたりできる
とりあえず、今回は、ボタンがクリックされるたびに、10人ずつ予約が埋まるというもの
まぁしつこいようだけど
一撃くらうごとにHPが減るとかにも使える
まぁ処理を書き換えればだけどね
では、解説
プログレスパーの値は、
progress要素のvalueプロパティに入っている
このvalueプロパティの値を読み出して
計算を行い、結果をvalueプロパティに書きこめばok
格ゲーのあたり判定がでたら
ライフが減る計算して、それをライフサイクルパーに反映しているとかんがえればわかりやすい
とりあえず
今回は、予約状況を調べるボタンのソース
document.getElementById(“resCheck”).addEventListener(“click”,function(){
基本的に、ボタン作成処理は
ボタンIDを
document.getElementById()へ設定して
判別させて
addEventListener()で動作を追加する
var n=document.getElementById(“resSTatus”).value;
このresSTatusは
progress要素のID
なので
.valueでその値を読み出しているということ
これで、変数nにこの値が代入される
これを10ずつ増やしたいなら
n=n+10;
そして、再度、値を書き換えたいから
document.getElementById(“resSTatus”).value=n;
これで、10足した状態に上書きされる
あとは、HTMLへ反映するため
ele.innerHTML=n;
},true);