onclick属性には気をつけて

 onclick属性にやられた。原因がわかるまでに、しばらく時間をとられた。


 input(type="submit"),buttonのようなsubmitを引き起こすHTML要素にonclick属性でjavascript関数を指定する場合には注意が必要だ。と痛感。


 なぜなら、falseを返さないとsubmitされる。
 関数を呼ぶだけではダメなんだ。
 つまり、
onclick="javascript:f()" の書き方ではダメで、
onclick="javascript:return f()" の形にする必要がある。


 うっかりreturnを書かなかったら、そんなつもりではないのにformがsubmitされてしまった。呼び出した関数の最後で false を返しているから大丈夫、なつもりだったので「あれ?」とあわてた。


 onclick属性を付けていた要素がbutton要素*1で、これなら自動的には submit されないだろうと誤解していたのも一因。


 formのsubmitをするかどうか怪しい関数には、たとえばこんな接頭辞をつけるようにすると、見直したときに気付きやすくなるかもね。
 just_: falseを返す関数
 maybe_submit_after_: trueまたはfalseを返し分ける関数
 submit_after_: trueを返す関数
 submit_: submit()を直接呼び出す関数
 jump_: location.href への直接代入をする関数


 自戒自戒。

*1:ちなみに、IE6にはbutton要素が複数あると押下したボタンだけでなく、フォーム内に存在するbutton要素のボタンすべてを一斉送信してしまう致命的なバグがあるそうです。IE6って困り者だなぁ。