#過去ログをあたりましたが、自分で納得いく解答がなかったので質問します。

フォームのsubmitボタンにonClickでチェッカーなどの関数を与えた場合、
submitでフォーム内容を送信するのと、onClickで指定されている関数の
どちらが先に処理されるのでしょうか。
(一応、WindowsのIE、ネスケ共々、onClickの処理の後、submitされるようではあります)

function tasikame {
(フォームの内容チェック/中略)
alert("入力されていない項目があります")
}

例えば、このような関数をonClickで起動する場合、フォームに入力されていない
項目があると、警告されます。
この時、submitはどの環境でも起動しないで終わるのでしょうか。
それとも警告が起動した後、フォーム内容はsubmitされてしまうのでしょうか。

#分かりづらければ、補足しますのでどうぞよろしく。

このQ&Aに関連する最新のQ&A

A 回答 (2件)

> 例えば、このような関数をonClickで起動する場合、フォームに入力されていない


> 項目があると、警告されます。
> この時、submitはどの環境でも起動しないで終わるのでしょうか。
> それとも警告が起動した後、フォーム内容はsubmitされてしまうのでしょうか。

この関数の書き方だと、警告のメッセージボックスが表示され、OK を押すと、フォームの
内容は submit されます。

イベントハンドラでは、false を返すことで、本来の動作をキャンセルすることができます。
ですから、期待する(であろう)動作をするためには、

function tasikame {
 //フォームの内容チェック
  ...

 if ( フォームの内容が正しくなければ ) {
  alert("入力されていない項目があります");
  return false;
 } else {
  return true;
 }
}

というような書き方になります。
    • good
    • 0
この回答へのお礼

解答ありがとうございます。
面倒なのでなるべく文を短くしようと思ったのですが、
やはりfalseは返した方がいいんですね。
参考になりました。

お礼日時:2001/10/21 00:18

送信前の入力チェックを行うのであれば、submitボタンのonClickではなくて、FORMのonSubmitで行うべきですよ。



  <FORM name="xxx" … onSubmit="return tasikame()">

このようにすることで、例えばIEで、テキストボックス内でEnterキーを押された時に、チェックを通らないで送信されることがなくなります。

ちなみに、送信される/されないは、a-kumaさんの回答の通りですので、入力チェック用の関数から true または false を返すようにしましょう。
また、呼び出し元の onSubmit="" の中でも、上記例のように、関数の戻り値をそのまま return するようにして下さい。
    • good
    • 0
この回答へのお礼

解答ありがとうございました。
onClickよりonSubmitの方でやるんですね。
ついつい、Enterキーの事を忘れてしまっていました。
こちらも参考にして、頑張ってみます。

お礼日時:2001/10/21 00:21

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Q英訳 順番について

日本の都道府県を、北のほうから1.北海道、2.青森、というふうに
北を優先して若い番号をつける場合

「Prefectures are numbered from north to south.」

でいいでしょうか?もっとわかりやすく書く方法はないでしょうか?

Aベストアンサー

それで十分と思いますが、
"in sequence" (順番に)を入れても良いかも知れません。
Prefectures are numbered in sequence from north to south.
又、例を入れれば完璧でしょう。
(e.g. 1. Hokkaido, 2. Aomori, etc)

QonClickで関数呼出し後に、結果に応じて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で実現したいと
考えております。

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に
遷移させたいのですが、上記記述では、遷移しませ...続きを読む

Aベストアンサー

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

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

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

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


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

2.カンマ(,)で区切った場合、
この場合、「return func(),submit();」が1つの文となります。この「,」は、左右の式を評価して、右...続きを読む

Q英訳

i not want leave you
英訳お願いします。
それと、もし単語を置く順番が違かったらお直しお願いします。

Aベストアンサー

I don't want to leave youで「君を放っておきたくない」「見捨てたくない」
のような意味になり、I don't want you to leaveで「行かないで」といった
感じの意味になります。

be動詞(am, are, isなど)の場合は am not, are not(aren't), is not(isn't)で
一般動詞はdo not(don't) want, does not(doesn't), did not(didn't)
といった形の否定形になります。

Q1つのフォーム内容を1つのsubmitで複数ページに同時送信

tomcat5.0+mysql5.1+jsp+html

まったく同じフォーム内容を2つのページに送信しようとしています。
center.jsp内にあるひとつのsubmitボタンを押して、同時に2つのページでデータを受け取りたいのです。
どなたかわかるかたいらっしゃいますでしょうか?

center.jsp → rightA.jsp
      → leftB.jsp

フレーム分割しているので、イメージ的には下記のような感じです。
action='rightA.jsp' method='post' target='rightA'
action='leftB.jsp' method='post' target='leftB'


※javascriptで可能だと知り合いから聞いたのでいろいろ調べてみましたが…
 いまいちjavascriptが理解できないでいます。

<script language="JavaScript">
<!--

function sendForm() {

formElem.method = "post";
formElem.action = "rightA.jsp";
formElem.target = "rightA";
              
formElem.action = "leftB.jsp";
formElem.target = "leftB";

 ~

}
// -->
</script>

<form name='form' action='' onsubmit='retrun sendForm()'> ~
          

tomcat5.0+mysql5.1+jsp+html

まったく同じフォーム内容を2つのページに送信しようとしています。
center.jsp内にあるひとつのsubmitボタンを押して、同時に2つのページでデータを受け取りたいのです。
どなたかわかるかたいらっしゃいますでしょうか?

center.jsp → rightA.jsp
      → leftB.jsp

フレーム分割しているので、イメージ的には下記のような感じです。
action='rightA.jsp' method='post' target='rightA'
action='leftB.jsp' method='post' target='leftB'


※javascript...続きを読む

Aベストアンサー

まず前提として、1つのページから2以上のページに飛ぶことは
一意性が失われるため、お勧めできません。
特にtargetを指定してページを開くことは非推奨のはずです。
それでもどうしてもというのであれば以下のように・・・

formElem.action = "rightA.jsp";
formElem.target = "rightA";
formElem.submit();          
formElem.action = "leftB.jsp";
formElem.target = "leftB";
formElem.submit();          
return false;

と、actionとtargetを指定した後にsubmitしてやり、最後にfalseを
返してやるとよいでしょう。(onsubmitにfalseが返るため)

Q以下を英訳するとどうなりますか?

この文をうまく英訳にするとどうなりますか?
「ここからは、2日目、3日目、・・・・7日目の順番で彼が計測できた値を示します」
うまく適切な英文があまりかけずに困っています

Aベストアンサー

「ここからは、2日目、3日目、・・・・7日目の順番で彼が計測できた値を示します。」

The graphic chart(or, diagram) here shows you the values he could measure at day 2, 3 then up to day 7.

ここからはを、「Power Point」なりの「プレゼン・ソフト」の解説文とこちらで勝手に仮定して、書いてみました。 聴衆は「あっ、次は図表なりなんなりが出てくるのだなと思ってくれます」


day 2, 3 and up to day 7 は「day second,third and up to day 7th」と読んで下さい。

Q複数のfunctionをonclickで実行するには?

こんばんは。
複数のfunctionを実行するにはどうしたらいいんでしょうか?
後、追加でなんですが、areaにhref属性を使わず(#を指定すると、ページの上に戻ってしまうため)にポインタを指(リンクに乗せたときのやつです)にするにはどうすればいいんでしょうか?

インラインフレーム1
<script>
<!--
function change1(picname) {
parent.frames['インラインフレーム2'].document.getElementById("ID1").src = picname;
}
function change2(picname) {
parent.frames['インラインフレーム2'].document.getElementById("ID2").src = picname;
}
・・・
function change3(picname) {
parent.frames['インラインフレーム2'].document.getElementById("ID8").src = picname;
}
//-->
</script>
上のfunctionを複数実行したいんです。(全てではありません)
<map name="">
<area shape="rect" coords="0,0,0,0" alt="" onclick="change1('ファイル')">
・・・
<area shape="rect" coords="0,0,0,0" alt="" onclick="change8('ファイル')">
</map>

インラインフレーム2
<div style="position: absolute; top: 0px; left: 0px; z-index: 0;"><img src="ファイル" id=ID1 alt="" border="0"></div>
<div style="position: absolute; top: 0px; left: 0px; z-index: 1;"><img src="ファイル" id=ID2 alt="" border="0"></div>
<div style="position: absolute; top: 0px; left: 0px; z-index: 2;"><img src="ファイル" id=ID3 alt="" border="0"></div>
・・・
<div style="position: absolute; top: 0px; left: 0px; z-index: 8;"><img src="ファイル" id=ID8="0"></div>
どうでしょう?
自分なりに試してみたんですが、成功しませんでした。(onclickにいっぱいくっつけたりとか・・・)
どうかお願いします。

こんばんは。
複数のfunctionを実行するにはどうしたらいいんでしょうか?
後、追加でなんですが、areaにhref属性を使わず(#を指定すると、ページの上に戻ってしまうため)にポインタを指(リンクに乗せたときのやつです)にするにはどうすればいいんでしょうか?

インラインフレーム1
<script>
<!--
function change1(picname) {
parent.frames['インラインフレーム2'].document.getElementById("ID1").src = picname;
}
function change2(picname) {
parent.frames['インラインフレーム...続きを読む

Aベストアンサー

簡単にするために、まず、functionもまとめてしまいましょう。
現状では、画像のファイルパスが引数になっていますが、変更するエレメントの指定も引数にしてしまえば、以下のひとつで済んでしまいます。
function change0(idn.picname){
parent.frames['インラインフレーム2'].document.getElementById(idn).src = picname;
}
呼び出す側は onclick="change0('ID1','ファイル')" などとなります。

処理を2種類以上行いたい場合は、
 onclick="change0('ID1','ファイル1'); change0('ID2','ファイル2');"
などのようにしてあげればよいです。

他にもいろいろ方法は考えられるけれど、一例です。
(関係ないけど、質問文はいろんなところが全角文字だけど、
 それは質問文用ということですよね?)

Q英訳おねがいします。

「それらは改良促進のためにAとBの技術を顧客に提供する仕事です」

上記の英訳をおねがいします。
自分で挑戦してみたのですが、順番から何からわけがわからなくなってしまいました。
どなたかよろしくお願いします。

Aベストアンサー

Those are the jobs to provide the customers with the technologies of A and B to promote improvement.

Q送信ボタンをbuttonに変えてonclickでsubmitがうまくいきません

宜しく御願いします。
enterキーでの誤送信を防ごうと過去ログをみてそのとおりにフォームのsubmitをfalseで返し、送信ボタンをbuttonにかえてタイトルのようにjavascriptで送信しようとしたのですが「ページでエラーが発生しました」と画面下のステータスバー(?)に表示され、うまくいきません。どなたか御教授ください。ちなみにページはPHPで書いており、フレームを使用しております。
若しくは別の方法でenterキー入力を回避できる方法があれば教えてください。(onfocus以外で)

Aベストアンサー

#2です

しつれいしました。1点見逃してました
buttonの名前に「submit」はつかえません。
「submit1」とか適当な名前にしてみてください

Q次の文の英訳教えてください。

子供のころに忘れられない体験をしたんですね、驚きました。
(3)子供のころに・・・In the days of a child
(2)忘れられない体験・・・An unforgettable experience
(1)したんですね・・・I did it
(4)驚きました・・・I was surprised
この順番でこの英訳であってますか?

Aベストアンサー

1文にまとめるのなら、
(1)私は驚いた I was surprised
(2)あなたが持った you had
(3)忘れられない体験を an unforgettable experience
(4)子供の頃に when you were a child.
と なります。

(4)は色々表現の仕方があります。中学校でも習う
when節にしていみました。

QonClick="this.form.submit

・下記のようなformがあるのですが、 onClick="this.form.submit();" disabledの意味を教えてください
・クリックしたら、このフォーム内容を送信?
・アクション先も指定していないのに、処理はどこへいくのでしょうか?
・また、disabledは? ずっと押せない?
<form name="hoge" method="POST">
<input name="hoge" type="button" class="button" value="piyo" onClick="this.form.submit();" disabled>
</form>

Aベストアンサー

>・クリックしたら、このフォーム内容を送信?
うん、this.form.submit();はこのフォームをsubmitとそのまま解釈すれば良い。

>・アクション先も指定していないのに、処理はどこへいくのでしょうか?
これはactionの指定が無ければ自身に送信。パラメータを送信しつつリロードみたいな動き。

>また、disabledは? ずっと押せない?
これは二回クリックされることを回避させている。
表示されているページがボタンをクリックするとリロードされるから一瞬押せなくなるけどまたパラメータ送信後、ページが表示されたときはまた押せる状態になっている。


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング