{js} オブジェクトっぽいことの続き。

クリックすると非表示テキストが表示。何の実用性もないサンプルコード。こんな程度だとこんな描き方する意味がない。全く無意味。

好きな歌手 好きなシンガー 好きな食べ物

しいなりんご

しいなりんご

りんご

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script>
<script type="text/javascript">
$(function(){

	var hoge = {
		
		//最初の非表示処理
		init:function(){
			$("#bar1,#bar2,#bar3").css({ display:"none" });
			},
	
		//表示処理1
		a1:function(){
			$("#bar1").css({ display:"block" });
		},
		
		//表示処理2
		a2:function(){
			$("#bar2").css({ display:"block" });
		},
		
		//表示処理3
		a3:function(){
			$("#bar3").css({ display:"block" });
		}

	};//end hoge
	
	
	//Initialization processing
	hoge.init();

	//クリック処理1
	$("a#cli1").click(function(){
		hoge.a1();
	})
	
	//クリック処理2
	$("a#cli2").click(function(){
		hoge.a2();
	})
	
	//クリック処理3
	$("a#cli3").click(function(){
		hoge.a3();
	})


	
})//end $

</script>

<p><a id="cli1">好きな歌手</a>
<a id="cli2">好きなシンガー</a>
<a id="cli3">好きな食べ物</a></p>

<p id="bar1">しいなりんご</p>
<p id="bar2">しいなりんご</p>
<p id="bar3">りんご</p>