IEでsubmit()

IEでJSからsubmit()できないことがある件。

---

<a href="javascript:;" onclick="doSubmit();">送信！</a>

<form action="test.php" method="POST" id="testForm" name="testForm">

<input name="testVal" type="hidden" value="テストだよ">

</form>

上記のようなHTMLがあるとして、

function doSubmit(){

	document.getElementById('testForm').submit();

}

上記のようなJS関数を実行してフォームを送信しようとすると、

Firefoxでは問題なく送信できるが、IEでは送信できない(>_<)

---

まず、HTMLを

<a href="javascript:void(0);" onclick="return doSubmit();">送信！</a>

<form action="test.php" method="POST" id="testForm" name="testForm">

<input name="testVal" type="hidden" value="テストだよ">

</form>

と修正して、

function doSubmit(){

	document.getElementById('testForm').submit();

	return false;

}

JSはこのように変更。

何をしたかというと、<a>のhrefをvoid(0)で無効化して、さらに、onclickはfalseを返すようにする。IEではどうやら、JS関数の中のsubmit()より、<a>の働きが優先されるようで、これらをすべて無効化する必要があるよう。

これで半日悩んだ。
ある意味正しいような、でも、なんか納得いかない(>_<)

IEはツンデレだ・・・いやツンツンしてるだけか（爆

---

ちなみに、

<a href="javascript:void(0);" onclick="return doSubmit();">送信！</a>

<form action="test.php" method="POST" id="testForm" name="testForm">

<input name="testVal" type="hidden" value="テストだよ">
<input type="submit" name="submit" id="submit" value="送信" />

</form>

こんな風に<form>タグの中に「submit」という名前の要素が入ると、submit()ができなくなる。これも注意。

JSは何でもかんでもオブジェクトなので、同じ名前のものがあれば、当然そちらで上書きされる。

迂闊な名前をつけるのはやめよう。