こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

Javascriptを短くしたい

初歩的なことですみません。

Javascriptで表示/非表示を切り替えるものを作ろうと思うのですが、
以下のサンプル文のような形では、項目数が増えるとその分だけ
どんどんJavascriptも長くなっていってしまいます。

Javascript文を簡潔にするには、どのように記述すればよいのでしょうか。
よろしくお願いします。



<script type="text/javascript">
<!--
function Hyo1(num)
{
if (num == 0)
{
document.getElementById("cont1").style.display="block";
}
else
{
document.getElementById("cont1").style.display="none";
}
}

function Hyo2(num)
{
if (num == 0)
{
document.getElementById("cont2").style.display="block";
}
else
{
document.getElementById("cont2").style.display="none";
}
}
// -->
</script>



<div id="cont1">ああああああ</div>
<form>
<input type="button" value="表示" onclick="Hyo1(0)">
<input type="button" value="非表示" onclick="Hyo1(1)">
</form>
<form>

<div id="cont2">いいいいいい</div>
<input type="button" value="表示" onclick="Hyo2(0)">
<input type="button" value="非表示" onclick="Hyo2(1)">
</form>

投稿日時 - 2010-12-24 23:26:01

QNo.6405425

すぐに回答ほしいです

質問者が選んだベストアンサー

どのくらい短くしたいかにもよりますが…。


<script type="text/javascript">
<!--
function Hyo(id, visible)
{
var style = (visible ? 'block' : 'none');
document.getElementById(id).style.display = style;
}
// -->
</script>

<div id="cont1">ああああああ</div>
<form>
<input type="button" value="表示" onclick="Hyo('cont1', 1)">
<input type="button" value="非表示" onclick="Hyo('cont1', 0)">
</form>
<form>

<div id="cont2">いいいいいい</div>
<input type="button" value="表示" onclick="Hyo('cont2', 1)">
<input type="button" value="非表示" onclick="Hyo('cont2', 0)">
</form>

投稿日時 - 2010-12-25 00:26:11

お礼

ありがとうございます!

説明がヘタですみません。
回答頂いたソース、とてもシンプルでまさに求めていたものです。
わからなくて困っていたので大変助かりました。

自分も勉強してこういうのススっと書けるようになりたいですー。

投稿日時 - 2010-12-25 00:53:05

ANo.1

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問