(三項演算子の書式)・・・ 変数 = (条件式)?(真の場合に実行):(偽の場合に実行)
上の(偽の場合に実行)をさらに三項演算子にすると、さらに複雑な条件分岐にできます。
下の例は三項演算子を4つ入れ子にし、時間によって背景色を変更しています。
ウォーキングしよう!
この例は、以下のようなif分で書いても同じこと。 (俺にはこっちのほうが解りやすいが、好みの問題か。三項演算子は、慣れもあろうが、ピンとこないんだヨ・・)
var bgc;
if(time > 19)bgc = "dimgray";
else if(time > 14)bgc = "lightsteelblue";
else if(time > 8)bgc = "cornsilk";
else if(time > 3)bgc = "lavender";
else bgc = "black";
document.getElementById("box").style.backgroundColor
= bgc;
Sample Source......................................................................>>>
<script language="JavaScript"><!--
function ChangeCokor(){
var time =document.form1.sele_time.selectedIndex; //時刻
document.getElementById("box").style.backgroundColor = (time > 19) ? "dimgray" : ((time > 14) ? "lightsteelblue"
: ((time > 8) ? "cornsilk"
: ((time > 3) ? "lavender" :"black")));
}
//--></script>
</head>
<form name="form1">
サア!、
<select name="sele_time">
<option>1時</option>
<option >2時</option>
・・・(略)
<option value="24">24時</option>
</select>
だぁ、 <input type="button" onclick="ChangeCokor();"
value="ウォーキングしょ!">
</form>