プログラミング

【JavaScript】Javascriptで表示と非表示のきりかえ

※はてブより引っ越しました。

たまーに必要になるJavaScriptでの表示と非表示のきりかえについて。

今回はラジオボタンを押したら表示と非表示が切り替わる動きにしました。

表示と非表示を切り替える

ラジオボタンで表示と非表示を切り替えるやり方です。

スクリプト。

<script language=javascript>

 // 表示変更イベント
 function onChangeRadio(obj) {
     if(obj.value == 0) {
       document.getElementById("selectRadio").style.display = "block";
     } else {
       document.getElementById("selectRadio").style.display = "none";
    }
	
}

</script>

formの内容。

<form>
	<div id="selectRadio">チェックすると変わるよ</div>
	表示
	<input type="radio" value="0" onclick="onChangeRadio(this)"/>
	非表示
	<input type="radio" value="1" onclick="onChangeRadio(this)"/>
</form>

表示と非表示を切り替えるのはいくつか方法がありますが今回はdisplayの"block"と"none"で切り替えています。

thisでformの内容を引数で渡していますね。

F12でデバックして引数のobjの値を見てみると"0"と"1"で切り替わっているのがわかると思います。

まとめ

displayを使って表示と非表示を切り替えることができました。

JavaScriptはなんとなーく使っているので、一度ちゃんと勉強しないとですね('ω')

RECOMMEND

1

新卒で入社したけど『もう仕事を辞めたい』『我慢できない』という方に向けて。新卒入社でカフェのフロアスタッフとしてして働いたけれど、約1年で退職した私からアドバイスです。心がだめになるまで続ける必要なんてありません。

2

女性はライフステージによって休職や転職しなければいけないときがありますよね。
そこでこの記事では女性の転職に有利な資格をまとめてみました。
一生職に困らない、転職に有利な資格とはなにかご覧ください。

3

「今日は会社に行く気がしない・・。」「たまには会社をさぼりたい・・。」なんてことありませんか?本記事では、実際に私の周りで使われていた欠勤理由をご紹介します。今から使える欠勤理由です。本当に仕事に行きたくないときなど活用できると思うので、ぜひ読んでみてください。

-プログラミング

Copyright© Job search info , 2020 All Rights Reserved.