onClickで関数呼出し後に、結果に応じてsubmitを実行する方法

質問

JavaScriptで、
function func() {
　if (a==0) {
　　alert("処理しない");
　　return false;
　}
　return true;
}
と、a=0ならfalseを返し、それ以外ならtrueを返す関数を定義しています。

そして、FORMタグで
<FORM NAME="FormName" ACTION="next.html">
<INPUT TYPE="button" VALUE="next" NAME="button1" onClick="return func();submit();">
</FORM>
と記述しています。
要は、ボタンを押下した際にfunc関数がtrueを返せば、next.htmlに
遷移させたいのですが、上記記述では、遷移しません・・・
onClick部分にonClick="return func(),submit();"と記述した場合、
func関数の実行結果がtrueでもfalseでも遷移してしまいます。
そこで、なんとなくonClick="return func()&&submit();"と記述してみたところ、
func関数がtrueの時のみうまく遷移するようになりました。

これは偶然そう動作しているのでしょうか、それとも上記は正しい記述方法なのでしょうか？
正しい記述方法ならいいのですが、上記以外に正式な記述方法があれば
教えていただけないでしょうか？

※TYPE="submit"にすればいいとは思うのですが、buttonで実現したいと
考えております。

回答No.2

noname#3852 · ベストアンサー

３つのパターンをみる限り、理由は以下の通りと思います。
１．セミコロン(;)で区切った場合、
この場合、「return func();」と「submit();」とは別の文です。returnはその時点の値を戻して、それ以降の動作を打ち切ってしまいます。よって、onClickイベントはfuncメソッドの戻り値(true/false関係なく)を戻して、そこで終了、それ以降のsubmitは実行しないとなります。

２．カンマ（,）で区切った場合、
この場合、「return func(),submit();」が１つの文となります。この「,」は、左右の式を評価して、右式を結果とする演算子です。よって、funcメソッド、submitメソッド両方を評価するため、funcメソッドの戻り値に関係なく、submitされます。

３．&&で区切った場合、
論理演算子「&&」は、左右ともにtrue(0以外)の場合のみtrueとする演算子です。また、２項論理演算子は左式から評価し、左式だけで全体の結果がわかる場合、右式を評価しません。よって、funcメソッドがfalseを戻した場合、その時点でsubmitを評価しなくても演算結果は必ずfalseとなるのでそこで打ち切られ、trueを戻した場合、submitを評価しないと演算結果を得られないため、遷移したわけです。「&&」を「||（論理和）」に変更すると逆の結果得たと思います。

さて、では３の「&&」が正しいかと言われたら、文法上は正しいです。ただし、他人がみてわかるとは思えません。
そこで、以下の記述はいかがでしょう。読んでみてソースを理解できますか。

<FORM NAME="FormName" ACTION="next.html">
<INPUT TYPE="button" VALUE="next" NAME="button1" onClick="func()">
</FORM>

（中略）

// funcの定義
function func() {
　if (a==0) {
　　alert("処理しない");
　　return ;
　}
　document.FormName.submit();
}

要は、ボタンを押されたら、funcを呼び出せ。
funcでは、aが0ならば、そこで終了しろ。
そうでなければ、documentオブジェクト内のFormNameと言う名前のオブジェクトのsubmitメソッドを呼べ。
です。

お礼

詳細な解説ありがとうございます。
3パターンそれぞれの動作理由が理解できました。

別の実現方法ですが、関数内でsubmit()を実行させてやればいいわけですね。
恥ずかしながら、思いつきませんでした・・・
本当にありがとうございました。

回答No.1

kokucho81

>func()&&submit();
おお、この記述方は「しゃれ」てますね。
&& は左側がfalseの時は、右を評価（実行）しないので、&&がtrueの時だけsubmit()を実行するわけですね。
いいんじゃないでしょうか。

お礼

実はなにも考えずに&&と記述していたのですが、
なぜ動作していたかが理解できました。
ありがとうございました。