質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.91%

Javascript confirm等…について

解決済

回答 3

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,843
退会済みユーザー

退会済みユーザー

Javascriptでのconfirmなどについてわかりませんでした…
script文です

     function check(){
      var message="";
      var kk;
       if(document.cancel.i.value==""){
         message +="お名前が未入力です。\n";
        }
       if(!document.cancel.i.value==""){
        message +="お名前:"+document.cancel.i.value+"\n";
        }

        for(kk=0; kk<1; ++kk){
          if(document.cancel.j[kk].selected==true){
            message +="お住いの都道府県が選択されていません。\n";
           }
         }
        for(kk=1; kk<7; ++kk){
          if(document.cancel.j[kk].selected==true){
            message +="都道府県:"+document.cancel.j.value+"\n";
           }
         }

       if(document.cancel.k[0].checked == false &&cancel.k[1].checked== false){
         message += "性別が選択されていません\n";
        }
        if(document.cancel.k[0].checked == true){
         message +="性別:Male\n";
        }
       if(document.cancel.k[1].checked == true){
         message +="性別:Female\n";
        }

        if(document.cancel.txtarea.value==""){
         message +="お問い合わせ内容が未入力です。\n";
        }
       if(!document.cancel.txtarea.value==""){
         message +="お問い合わせ内容:"+document.cancel.txtarea.value+"\n";
        }       
       if(!message==""){
      alert(message);
        return false;
      }
     }
    </script>


HTML文です

 <body>
    <form action="sample.php" method="post" name="cancel" onSubmit="return check()">
     <p><label>お名前:<input type="text" name="i" id="uname"></label></p>
        <p>
     <label>お住いの都道府県:</label>
     <select id="prefecture" name="j">
      <option selected value="todohuken">都道府県</option>
      <option value="ibaraki">茨城県</option>
      <option value="tochigi">栃木県</option>
      <option value="gunma">群馬県</option>
      <option value="saitama">埼玉県</option>
      <option value="tiba">千葉県</option>
      <option value="tokyo">東京都</option>
      <option value="kanagawa">神奈川県</option>
     </select>
     </p>
     <fieldset><legend>性別</legend>
      <input type="radio" name="k" value="Male" id="male"><label for="male">男性</label>
      <input type="radio" name="k" value="Female" id="female"><label for="female">女性</label>
     </fieldset>
         <p>
     <label for="demand">お問い合わせ内容を以下に記入してください:</label><br>
     <textarea id="demand" name="txtarea" cols="40" rows="4" maxlength="20"></textarea>
    </p>

    </form>
 </body>


質問内容としては、javascriptのほうのif文の

if(!document.cancel.i.value==""){
        message +="お名前:"+document.cancel.i.value+"\n";
        }
for(kk=1; kk<7; ++kk){
          if(document.cancel.j[kk].selected==true){
            message +="都道府県:"+document.cancel.j.value+"\n";
           }
         }
if(document.cancel.k[0].checked == true){
         message +="性別:Male\n";
        }
       if(document.cancel.k[1].checked == true){
         message +="性別:Female\n";
        }
if(!document.cancel.txtarea.value==""){
         message +="お問い合わせ内容:"+document.cancel.txtarea.value+"\n";
        }       


の部分だけ(性別に関してはどちらか一方)をconfirm を使って alertで表示し、OKを押したらsample.phpに移動しキャンセルならこのページに留まるようにしたいです。
また、送信前に都道府県の中で選択したものがそのまま送信前でお問い合わせ内容の部分に表示されるようにしたいです。

どちらも いろいろ調べてやってみたものの confirmに関しては、window.confirmというのならあるけれどこのようなmessageのようなメッセージを出すには使うことができず… 使い方が間違っていたのかも…?
また、お問合せ内容に表示させるものに関しては、textareaの部分に何か書くのはわかったのですが 何を書いたらいいかわからず…
どなたか 教えていただけるとありがたいです

追加して 書いてみた結果…

        function disp(){
        if(window.confirm(message)){
           location.href="sample.php";
          }
          else{
            window.alert('キャンセル');
            }
         }


を if(!message==""){
alert(message);
return false;
の前の部分に入れ
HTMLでは

<body>
    <form action="sample.php" method="post" name="cancel" onSubmit="return check()">
     <p><label>お名前:<input type="text" name="i" id="uname"></label></p>
        <p>
     <label>お住いの都道府県:</label>
     <select id="prefecture" name="j">
      <option selected value="todohuken">都道府県</option>
      <option value="ibaraki">茨城県</option>
      <option value="tochigi">栃木県</option>
      <option value="gunma">群馬県</option>
      <option value="saitama">埼玉県</option>
      <option value="tiba">千葉県</option>
      <option value="tokyo">東京都</option>
      <option value="kanagawa">神奈川県</option>
     </select>
     </p>
     <fieldset><legend>性別</legend>
      <input type="radio" name="k" value="Male" id="male"><label for="male">男性</label>
      <input type="radio" name="k" value="Female" id="female"><label for="female">女性</label>
     </fieldset>
         <p>
     <label for="demand">お問い合わせ内容を以下に記入してください:</label><br>
     <textarea id="demand" name="txtarea" cols="40" rows="4" maxlength="20"></textarea>
    </p>
  <input type="button" value="送信" onClick="disp()"></p>
    </form>
 </body>


とやってみました。が、うまくできず…  どのようにしたらよかったのでしょうか…?
ちなみに表示させたいのはこのような感じでOKならsample.phpへ移動し、キャンセルならページにとどまりたいです 表示させてる内容はこの問題とはまた違ったものです。
イメージ説明

修正した後ここまではできたんですが、ここからできなくなってしまって…
OKとキャンセルは出たんですがOKを押してもページ先で表示されるはずの入力した内容が出なくなってしまいました… どうしたらいいのでしょうか…

          if(window.confirm(message)){
        location.href="sample.php";

        }
     }
    </script>


上の三行を追加しました。またHTMLの部分も変更しました。

    <input type="button" value="送信" onClick="check()"></p>
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • kei344

    2017/05/25 03:50

    confirmの何がどうわからないのでしょうか。具体的に試したコードを追記し、自分が思っていた挙動とどのように違うかを具体的にかかれてはいかがでしょう。

    キャンセル

  • 退会済みユーザー

    退会済みユーザー

    2017/05/25 18:03

    わかりました 追加しておきます

    キャンセル

回答 3

checkベストアンサー

+2

>confirm を使って alertで表示
そもそもconfirmとalertでは用途が違うので混在しないようにしましょう。

alert - 通知
confirm - 確認

confirmでOK時、キャンセル時は下記を参考にしてください。
http://www.tagindex.com/javascript/window/confirm.html
ご提示のmessageも問題なく使えると思います。
キャンセル時にはalert()で書かれているようにreturn falseをすることで何もしません(=ページに留まる)
画面遷移についてはsample.phpがformのactionに設定されているのでOK時にreturn trueすれば良いと思います。

そういえば、送信(submit)するボタンが設置されていないように見受けられます。
type=textでEnterするしかないような・・?
ひとまず、Submitボタンを置いた方が良いでしょう。
http://www.htmq.com/html5/button.shtml
(ボタンを置いたらonclickでご提示のreturn check()を設置します)

 追記を受けて

<input type="button" value="送信" onClick="disp()"></p>

<input type="submit" value="送信" onClick="return disp();"></p>

returnを設定していないとreturn falseを受け取らないのでそのまま送信してしまいます。
「画面遷移」をするわけではなく「入力情報をformのactionに設定した先に送信する」ので
locationはいりません。<form>の中にsubmitボタンがあれば<form>内の入力情報を全て送信してくれます。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

+1

location.href="sample.php";

これは、ページを単に移動するので、フォームに記入した内容は送られません。

【form.submit - フォームをsubmitする - JavaScriptリファレンス】
http://javascriptist.net/ref/form.submit.html

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

+1

<form action="sample.php" method="post" name="cancel" onSubmit="return check()">

としているなら

function check(){
 return confirm("test\ntest\ntest\ntest");
}

とすればよいのでは?

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.91%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る