ボタンを押すとボタンのラベルと画像が入れ替わります。
キーを押すたびに二つの状態が入れ替わるトグルボタン。
サンプルソース
<html>
<head>
<title>トグルスイッチ（０と１、trueとfalseを切り替え）条件分岐</title>
<script language="JavaScript">
<!--
flag = false;
num = 0;
function toggle(){
flag = !flag; // trueとfalseの切り替え ! 否定演算子
document.getElementById("botan").value = flag; // ボタンのラベルの変更
if(flag == true){ alert(flag); } //条件を満たした場合の処理
else{ alert(flag); } //条件を満たしていない場合の処理}
}
function toggle01(){
num ^= 1; // 0と1の切り替え ^ 排他的論理和
document.getElementById("botan01").value = num;
if(num == 1){ alert(num); } //条件を満たした場合の処理
else{ alert(num); } //条件を満たしていない場合の処理
}
// -->
</script>
</head>
<body>
<p>キーを押すたびに二つの状態が入れ替わるトグルスイッチ。</p>
<input type="button" id="botan" value="トグルスイッチ true と false" onclick="toggle()" style="width : 150px;">
<input type="button" id="botan01" value="トグルスイッチ ０ と １" onclick="toggle01()" style="width : 150px;">
</body>
</html>
if文
if(flag == 0){ // 条件文
flag = 1; // 条件が真ならここを実行そうでなければ
}else{ // else 以降を実行
flag = 0;
}
条件演算子
(flag == false)?flag = true: flag = false;
条件が真なら1つ目の文、偽なら2つ目の文を実行する
