getElementByIdではまってます・・・

質問

以下のソースを書いて、Firefoxで実行すると
検索ボタンをクリックするとテーブルが表示されるのですが
すぐにもとに戻ってしまいます。
すいません。初心者です。
どなたかご教授ください。
言っている意味が分からなかったらすいません。
補足します。

HTMLです。
<td style="width:60px;" align="center"><input style="width:60px" type="submit" id="id" name="id" onclick="effectDetailWindow('detailWindow');" value="検索"></td>

<div id="detailWindow" style="display:none;">
<table border="1" cellpadding="3" cellspacing="1" bordercolor="#000000" style="width:460px;">
<tr>
<td style="width:80px;" class="table_head"> TEST1 </td>
<td style="width:150px;"> <input type="text" size="25" maxlength="50" name="searchtest1" value="{$form.searchtest1}"> </td>
<td style="width:80px;" class="table_head"> TEST2 </td>
<td style="width:150px;"> <input type="text" size="25" maxlength="50" name="searchtest2" value="{$form.searchtest2}"> </td>
</tr>
</table>
</div>

JavaScriptです。
function effectDetailWindow(id)
{
var obj = document.getElementById(id);
if( obj.style.display == "none" )
{
obj.style.display = "block"; }
else
{
obj.style.display = "none";
}
}

回答No.3

Hardking

effectDetailWindow関数を呼ぶボタンのタイプを
submitでなくbuttonに変更してください。
<input style="width:60px" type="submit"
↓
<input style="width:60px" type="button"

回答No.2

notnot

Firefoxでやってみましたが、問題なく動作しますよ。（クリックすると表示・非表示が切り替わる）

書いてない部分に問題があるのでは？
とりあえず、var obj = document.getElementById(id); の後に、
alert(obj.style.display);
とか入れてみては？

回答No.1

noname#94983

最初の、onclick="effectDetailWindowで呼び出している<input>だが、type="submit"になっているのが気になる。これだと、他に何もしてなければ送信してしまわないか。とりあえずこれをtype="button"に変更するとかしたらどうか。