function df()でなぜreturnできないのか

前へ 次へ
このQ&Aのポイント
  • 色々本日試したのですが、buttonの使用では画像をかこむことでreturnができますが、imageを使うと流れてしまいます。その理由がわかりません。なぜでしょうか？
  • function df()内で、imageを使用するとreturnが機能しないことがあります。buttonでは問題ありませんが、imageを使用する場合、なぜreturnができないのでしょうか？
  • function df()内で、buttonとimageの挙動に違いがあります。buttonではreturnができますが、imageではreturnが機能しないことがあります。なぜこのような違いが生じるのでしょうか？
回答を見る
  • ベストアンサー

まずみてもらいたいです。

function df(){ var sty=0; if(document.ad.ad1.value==""){ sty=1; } if(sty){ alert("記入漏れ"); return false; } else{ return true; } } function df1(){ alert("試験"); } --> </script> </head> <body> <form action="#" method="POST" name="ad" onSubmit="df1();return df();"> <p>試験<input type="text" size="20" name="ad1"></p> <p>試験<input type="text" size="20" name="ad2"></p> <p><input type="image" src="rtp/migi.jpg" onClick="this.form.submit()"></p> </form> </body> 色々本日試したのですが <button>で画像をかこめばreturnができるんですが imageを使うと流れてしまいます。 原理が解らず納得できません。何故でしょうか？

質問者が選んだベストアンサー

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

＞<input type="image" src="rtp/migi.jpg" onClick="this.form.submit()"> こいつのonclickがいらないだけでは? <input type="image" src="rtp/migi.jpg">

yonbakukan
質問者

補足

やってはみますが、サブミットにならないんではないでしょうか？ それとform全体をthisで捕まえているという事は・・・と考えてしまいます。 すいません。素人なんで。

その他の回答 (1)

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.2

＞サブミットにならないんではないでしょうか？ inputのtype="image"はサブミットをかねてます どうしてもonclickで処理するなら onclick="df1();if(df()) this.form.submit();" のようにdf()の戻り値がtrueのときだけsubmitするようにしてください

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • javascriptについて

    function df(){ document.ad.ad1.value=500; } function df2(a){ var sty=a.ad2.selectedIndex; a.ad3.value=eval(a.ad1.value)*eval(a.ad2.options[sty].value); } function df3(){ var s1=document.ad.ad3.value; var s2=document.ad.ad4.value; var fv=s1+"円\n"+ s2+"様"; var don=confirm(fv); } function df4(){ var p=0; if(document.ad.ad4.value==""){ p=1; } if(p){ alert("記入漏れ"); return false; } else{ return true; } } --> </script> </head> <body> <form action="#" method="POST" name="ad"> <p>ラーメン<input type="text" soze="20" value="500" name="ad1" onChange="df()">円</p> <p><select name="ad2" onChange="df2(this.form)"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> 個 </select> </p> <p>合計<input type="text" size="20" name="ad3">円</p> <p>備考：<input type="text" size="20" name="ad4"></p> <p><button onClick="df3();df4();"><img src="rtp/migi.jpg"></button></p> </form> </body> </html> 内容に間違いがあっても データーを送ってしまいます。 何故なんでしょうか？

  • javascriptについて

    <script type="text/javascript"> <!-- function df(){ var scr=100; if(document.ad.y.checked){ var sty=document.ad.a; for(var i=0;i<3;i++){ if(sty[i].checked){ scr+=20+10*i; break; } } } document.ad.ad1.value=scr; } --> </script> </head> <body> <form action="#" method="POST" name="ad"> <h4>毎日歯を磨きますか？</h4> <p><input type="checkbox" name="y" value="">はい<br> <input type="checkbox" name="n" value="">いいえ</p> <h4>何回</h4> <p>1回<input type="radio" name="a" value=""><br> 2回<input type="radio" name="a" value=""><br> 3回<input type="radio" name="a" value=""></p> <p>何<input type="text" size="20" name="ad1">点</p> <p><input type="button" value="配点" onClick="df()">&nbsp;<input type="reset" value="リセット"></p> </form> </body> </html> プログラムとしては成功しているんですが 解らないところが for(var i=0;i<3;i++) のところです。ラジオボタンに添え字を使って計算をしているという プログラムなのでしょうが たとえばlengthではなくあえて数字を入れてるのは 配列ではないからでしょうか？ もう一点 formをつかって button やimage　などを使うと 間違いを指摘してもデーターが流れて言ってしまいます。 return falseなど工夫はしてますが データーをtextに入っている文面を消さずに修正させるいい方法はありませんか お願いします。

  • 正規表現について

    function df(){ var sty=0; if(!document.ad.ad1.value.match(/[^0-9]+/)){ sty=1; } if(sty){ alert("違います"); return false; } else{ return ture; } } 一点だけわかりません。 (/[^0-9]+/)です。 普通に[0-9]で数字のみにすればいいのに /とか^はなんの意味があるんでしょうか？

  • javascriptでのアラート表示

    javascriptで大変困っております。 ラジオボタン・テキストエリアにまたがったチェックアラートをだしたいのですが、うまくいきません。 <script> function form_check(f) { if (f.Q1.value == "") { alert("・未記入です！"); return false; } ・ ・ ・ if (f.Q6.value == "") { alert("・名前が未記入です！"); return false; } else return true; } function reset_conf() { if (confirm("フォーム内容をリセットします！\n\nよろしいですか？")) return true; else return false; } </script> -------- <FORM ACTION="hogehoge.cgi" METHOD="POST" onSubmit="return form_check(this)"> 教育:<INPUT TYPE="radio" NAME="Q1" VALUE="OK"> テスト:<INPUT TYPE="radio" NAME="Q2" VALUE="OK">　 アンケート:<INPUT TYPE="radio" NAME="Q3" VALUE="OK"> AAA:<input name="Q4" type="text" /> BBB:<input name="Q5" type="text" /> CCC:<input name="Q6" type="text" /> <INPUT TYPE="hidden" NAME="number" VALUE="6"> <INPUT TYPE="submit" NAME="answer" VALUE="送信する"> <INPUT TYPE="reset" NAME="reset" VALUE="リセット"> </FORM> </form> ------- テキストエリアのアラートチェックは出来ない状態です。 すべてにチェックまたは、テキスト入力がされていないと送信できないようにしたいのです。 どうしたらよいでしょうか？

  • フォームのname値を配列にしてJavaScriptでフォームのチェックをする方法

    JavaScriptでフォームの半角数字のチェックをしたいのですが、 form内容をCGI(PHP)に渡すためname値を配列にしないといけないのですが、 以下のスクリプトだとエラーが出てしまいます。 *実際はif(isNaN～)と<input～>をループで書き出しており、行数が不特定なので それぞれ別のname値を使うことができない状態です。 <script language="JavaScript"> function check() { if(isNaN(document.form1.hoge[0].value)){ alert("値は半角数字で入力してください。"); return(false); } if(isNaN(document.form1.hoge[1].value)){ alert("値は半角数字で入力してください。"); return(false); } return(true); } </script> <form method="post" action="xxx.cgi" onSubmit="return check()" name="form1"> <input type="text" name="hoge[0]"> <input type="text" name="hoge[1]"> </form> 特にCGIに渡す必要がなければ <input type="text" name="hoge"> <input type="text" name="hoge"> としてやればチェックができるのですが、どうしても次の 処理があるためname値を配列にする必要があります。 解決方法がわかる方がおられましたらご教授ください。 以上よろしくお願いいたします。

  • フォームメールでURL送信時、存在しないURLの入力を拒否したい

    xmlhttprequest.comにあるxmlhttprequest.jsを使って、 会社の問い合わせページとして、URLやコメント等を入力して 送信できるメールフォームのページを作っています。 存在しないURLを入力した場合はエラーを返すようにしたのですが、 今度は、メールフォームのコマンドが実行されなくなって しまいました。 どこがおかしいのかご教示いただきたく。 <html><head><title>お問い合せ</title> <script type="text/javascript" src="xmlhttprequest.js"></script> <script type="text/javascript"><!-- xhobj = new XMLHttpRequest(); LoadFlg = 0; function init(){ } function go(){ document.form2.Url.value = "http://www.google.co.jp/" + document.form1.Url.value; document.form2.comment.value = document.form1.comment.value; if ( all_check(document.form1) ){ document.form2.submit(); } } function all_check(form){ if( !(nullCheck(form.Url,"URLを")) ){ return false; } if( !(nullCheck(form.comment,"問合せ内容を")) ){ return false; } if( !(stateCheck(form.Url)) ){ return false; } return true; } function alert_focus(obj,str){ alert(str + "入力してください。"); obj.focus(); } function nullCheck(obj,str){ if (obj.value == "" || obj.value == null){ alert_focus(obj,str); return false; }else{ return true; } } function stateCheck(obj){ if(xhobj == null){ alert("お使いのブラウザは対応していません。"); return false; } if(LoadFlg == 0){ LoadFlg = 1; xhobj.onreadystatechange = handleXHRequest; xhobj.open("GET", "http://www.google.co.jp/"+ obj.value, true); xhobj.send(null); } else { LoadFlg = 0; xhobj.abort(); return true; } } function handleXHRequest(){ if(xhobj.readyState == 4){ if(LoadFlg == 1){ if(xhobj.status != 200){ form1.state.value=xhobj.status; alert("存在しているURLを入力してください。"); return false; } xhobj.abort(); LoadFlg = 0; } return true; } } // --></script> </head> <body onLoad="init();"> <form name="form1" id="form1" method="get" action="javascript: go();"> ページURL：http://www.google.co.jp/<input name="Url" id="Url" type="text" value=""><br> 用件：<textarea name="comment"></textarea><br> <input type="reset" value="取消"><input type="submit" value="送信"><br> ステータス確認用：<input name="state" type="text" value=""> </form> <form name="form2" id="form2" method="post" action="http://URL/mail/"> <input type="hidden" name="subject" value="問合せメール"> <input type="hidden" name="Url" value=""> <input type="hidden" name="comment" value=""> </form> </body></html>

  • javascript フォームについて

    javascriptでフォームを作ったのですが、複数フォームの空白をチェックするにはどのようなプログラムにすればよろしいでしょうか？ onsubmit="return chk1(this)でフォーム送信が押されたときにチェックを行おうと考えているのですが そのときのchk()の中身やif文の条件がわからないのです。 どのようにすれば上手くいくでしょうか？ 回答よろしくお願いします。 ソースは以下のとおりです。 <script language="javascript"> function send() { document.nform.submit(); document.nform2.submit(); document.nform3.submit(); } function chk1(frm){ if(frm.elements["txt1"].value==""){ alert("解答欄に空白があります"); /* FALSEを返してフォームは送信しない */ return false; }else{ /* TRUEを返してフォーム送信 */ return true; } } </script> <form name="nform" method="POST" action="mailto:webmaster@a.com?subject=問い合せ" enctype="text/plain"> <p>問1</p> <p> (1)<input type="text" name="kaitouran11" size="20"> (2)<input type="text" name="kaitouran12" size="20"> (3)<input type="text" name="kaitouran13" size="20"> (4)<input type="text" name="kaitouran14" size="20"> </p> </form> <form name="nform2" method="POST" action="mailto:webmaster@leposystems.com?subject=問い合せ" enctype="text/plain"> <p>問2</p> <p> (1)<input type="text" name="kaitouran21" size="20"> (2)<input type="text" name="kaitouran22" size="20"> (3)<input type="text" name="kaitouran23" size="20"> (4)<input type="text" name="kaitouran24" size="20"> </p> </form> <form name="nform3" method="POST" action="mailto:webmaster@leposystems.com?subject=問い合せ" enctype="text/plain"> <p>問3</p> <p> (1)<input type="text" name="kaitouran31" size="20"> (2)<input type="text" name="kaitouran32" size="20"> (3)<input type="text" name="kaitouran33" size="20"> (4)<input type="text" name="kaitouran34" size="20"> </p> </form> <input type="button" value="送信" onClick="send()" onsubmit="return chk1(this)">

  • 通し番号の変数を一括チェックするには?

    JavaScriptでフォームの入力値のチェックを行う プログラムを書いています。 OnSubmitで処理を行っているのですが、チェック対象の テキストボックスが大量に存在しているので、 なんとか効率良く処理できないでしょうか? if( !NumCheck(form.text1.value) || !NumCheck(form.text2.value) || !NumCheck(form.text3.value) || /* ・・・ */ !NumCheck(form.text100.value) ) これをforか何かで回せるとベストなのですが…。 PHPのように文字列を変数名に変換する方法など、 なにか良いアプローチがありましたらご教示願います。 問題の部分抽出したHTMLを下に載せておきます。 そのままでは動きませんが、雰囲気が伝わればと。 インデントがなくてすみません。 よろしくお願いいたします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <script type="text/javascript"> <!-- function submitCheck(form){ if( !NumCheck(form.text1.value) || !NumCheck(form.text2.value) || !NumCheck(form.text3.value) || /* ・・・ */ !NumCheck(form.text100.value) ) { alert('入力エラー'); return false; } return true; } function NumCheck(value){ var tmp = value.match(/[0-9]+/g); if(tmp != value) return false; return true; } //--> </script> </head> <body> <form name="form1" action="test.cgi" target=_self method="post" onSubmit="return submitCheck(this);"> <input type="text" name=text1> <input type="text" name=text2> <input type="text" name=text3> /* ・・・ */ <input type="text" name=text100> </form> </body> </html>

  • ＣｈｅｃｋＢｏｘの入力チェックについて

    CheckBoxの入力チェックについて CheckBoxの数は可変です。 全て未チェックのときにalertを表示したいです。 今はチェックしてもalertが表示されてしまいます。 よろしくお願いします。 <html> <head> <meta http-equiv="Content-Language" content="ja"> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta name="GENERATOR" content="Microsoft FrontPage 4.0"> <meta name="ProgId" content="FrontPage.Editor.Document"> <title>チェックボックス入力チェック</title> <SCRIPT TYPE="text/javascript"> <!-- function item_check() { count = 0; for (i=0;i<=document.form1.elements['item[]'][i].length;i++){ if(document.form1.elements['item[]'][i].checked){ count++; } } if(count==0){ alert("項目を選択してください。"); return(false); } return(true); } --> </SCRIPT> </head> <body> <form name="form1" method="POST" action="test.htm" onSubmit="return item_check()"> <p><input type="checkbox" name="item[]" value="1">項目1</p> <p><input type="checkbox" name="item[]" value="2">項目2</p> <p><input type="checkbox" name="item[]" value="3">項目3</p> <p><input type="checkbox" name="item[]" value="4">項目4</p> <p><input type="checkbox" name="item[]" value="5">項目5</p> <input type="submit" name="kakunin" value="確認"> </form> </body> </html>

  • ＪＡＶＡＳＣＲＩＰＴでＩＮＰＵＴ

    ＨＴＭＬとＪＡＶＡＳＣＲＩＰＴとＪＳＰを使ってシステム構築をしております。 --------------- <html> <head> <SCRIPT Language="JavaScript"> <!-- function send() { alert("<input type=text name=name2>"); } //　--> </SCRIPT> </head> <body> <form onSubmit="send(); return false;"> <input type=text name=name1> <input type=submit> </form> </body> </html> --------------- 上記のコードでやりたいことは、 submitボタンが押されたときにJAVASCRIPTを呼び出し JAVASCRIPT上で文字を入力し次画面へ送信するような機能を作りたいと思っているのですが、本を見てもなかなか載っていません。 もしかしたらJAVASCRIPTだけではできないかもしれません。 ＪＳＰまたはＰＨＰで出来る機能でも良いので教えてください。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する