javascript ボタンによる表示について
javascriptのボタンによる表示について質問があります．
質問内容と致しましては，ボタンを表示した時に隠れている問題文を出現させるソースを作っているのですが，うまくプログラムが動作しません．
おそらく，window.onloadの使い方が理解しきれてないからだとは思いますが，
よくわかりませんので質問させていただきました．
回答の方よろしくお願いします．
以下ソースです．
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function hideForm1(){
document.getElementById("formblock1").style.display = "none";
}
function showForm1() {
document.getElementById("formblock1").style.display = "block";
}
window.onload = function(){
hideForm1();
};
function hideForm2(){
document.getElementById("formblock2").style.display = "none";
}
function showForm2() {
document.getElementById("formblock2").style.display = "block";
}
window.onload = function(){
hideForm2();
};
function hideForm3(){
document.getElementById("formblock3").style.display = "none";
}
function showForm3() {
document.getElementById("formblock3").style.display = "block";
}
window.onload = function(){
hideForm3();
};
function send(){
function chk1(frm, names){
var r = true;
for(var i = 0; i < names.length; i++) r &= (frm.elements[names[i]].value !="");
return r;
}
var r = true;
r &= chk1(document.forms['nform'],['kaitouran11','kaitouran12','kaitouran13','kaitouran14','kaitouran21','kaitouran22','kaitouran23','kaitouran24','kaitouran31','kaitouran32','kaitouran33','kaitouran34']);
if(r){
document.forms['nform'].submit();
}else{
alert('解答欄に空白があります');
}
}
</script>
</head>
<body>
<form>
<input type="button" value="問題1" onclick="showForm1(); this.disabled = true;"/>
</form>
<form>
<input type="button" value="問題2" onclick="showForm2(); this.disabled = true;"/>
</form>
<form>
<input type="button" value="問題3" onclick="showForm3(); this.disabled = true;"/>
</form>
<form name="nform" method="post" action="./kaitou1.php" enctype="multipart/form-data">
<div id="formblock1">
<p> 問題1</p>
<p>問題文</p>
<p>
(1)<input type="text" name="kaitouran11" size="14">
(2)<input type="text" name="kaitouran12" size="14">
(3)<input type="text" name="kaitouran13" size="14">
(4)<input type="text" name="kaitouran14" size="14">
</p>
</div>
<div id="formblock2">
<p> 問題2</p>
<p>問題文</p>
<p>
(1)<input type="text" name="kaitouran21" size="14">
(2)<input type="text" name="kaitouran22" size="14">
(3)<input type="text" name="kaitouran23" size="14">
(4)<input type="text" name="kaitouran24" size="14">
</p>
</div>
<div id="formblock3">
<p> 問題3</p>
<p>問題文</p>
<p>
(1)<input type="text" name="kaitouran31" size="14">
(2)<input type="text" name="kaitouran32" size="14">
(3)<input type="text" name="kaitouran33" size="14">
(4)<input type="text" name="kaitouran34" size="14">
</p>
</div>
</form>
<input type="button" value="送信" onclick="send()">
</body>
</html>
お礼
回答ありがとうございます。 これだと、一番初めのfrom内のinput要素にフォーカスが当たるんですね。 解決しました。