🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

3回答

2021閲覧

javascript window.location.href="変移先" 文が無視されます

masakifukuta

総合スコア58

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2019/11/20 03:56

編集2019/11/20 05:35

HTMLにてボタンを作成し、これをクリックするとcheckkuhaku()へ飛び、色々処理後、
window.location.href文にてページをジャンプするように作成したのですが、これが動作しません。
試しに、pege_jump()を色々なところから呼び出した所、body onloadイベントやbody onloadイベントにて呼ばれるfunctionからpage_jumpを呼び出したら動作しました。でも本来の期待するタイミングで動作してくれません。何かコードにwindow.location.hrefの動作を阻害する要素があるのでしょうか?
ブラウザはgoogle chromeです。お分かりになる方、ご教授下さい。よろしくお願い致します。

<html> <head> <title>楽 会員登録</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta charset="utf-8"> <style type="text/css"> body { background-color: #fcebd5; background-repeat:no-repeat; background-attachment: fixed; background-position: center top; } #center { text-align:center } .s16 {font-size:16pt} .s14 {font-size:14pt} .button { text-align:center; width:150px; font-size:24px; font-weight:bold; text-decoration:none; display:block; text-align:center; padding:8px 0 10px; color:#fff; background-color:#49a9d4; border-radius:5px; box-shadow:2px 2px #1a6ea0; text-shadow:0 -1px #1a6ea0; } </style> <!-- ↓JavaScriptの処理を追加 --> <script type="text/javascript"> function isRegNum(obj){ var str=obj.value; /* 入力値 */ if(str.match(/[^0-9]/g)){ /* 数値以外の文字列が含まれていた場合 */ alert (str.match(/[^0-9]/g)+'\n\n数値以外が含まれています'); /* アラート表示 */ obj.value=""; /* テキストボックスを空にする */ return false; } } function checkStr(){ var str1 = document.getElementById("password1").value; var str2 = document.getElementById("password2").value; if (str1.match(/[^0-9 a-z a-z A-Z]/g)){ alert("英数字以外が含まれています\n(" + str.match(/[^0-9 a-z a-z A-Z]/g) + ")"); return false; } if (str2.match(/[^0-9 a-z a-z A-Z]/g)){ alert("英数字以外が含まれています\n(" + str.match(/[^0-9 a-z a-z A-Z]/g) + ")"); return false; } if((str1!="") && (str2!="")){ if(str1 != str2){ alert("パスワードが一致しません。"); document.getElementById("password1").value=""; document.getElementById("password2").value=""; return false; } } } function checkMail(){ var str = document.getElementById("userid").value; if(str.match(/^([a-z0-9_.\-])+@([a-z0-9_.\-])+[^.]$/i)){ <!-- alert("入力OKです!"); --> }else{ alert("メールアドレスの形式が不正です!"); } } function checkkuhaku(){ /* ~ 略 ~ (コメントアウトして一時的に無効化) */ page_jump(); return false; } function page_jump(){ alert("hello1"); window.location.href='customer_information.php'; alert("hello2"); } function nyuuryokuzumi(){ var firstname = null; var lastname = null ; var adressno = null; var adress1 = null; var adress2 = null; var adress3 = null; var phone = null; var userid = null; str=document.cookie; if(!str){ return false; } var str2=null; //result = s.substring( start [, end] ) result = str.split(";"); result.forEach( function (str2) { if(str2.indexOf("firstname")>0){ firstname =str2.substring( ("'firstname=").length , str2.length-1 ); } if(str2.indexOf("lastname")>0){ lastname = str2.substring( ("'lastname=").length+1 , str2.length-1 ); } if(str2.indexOf("adressno")>0){ adressno = str2.substring( ("'adessno=").length+2 , str2.length-1 ); } if(str2.indexOf("adress1")>0){ adress1 = str2.substring( ("'adress1=").length+1 , str2.length-1 ); } if(str2.indexOf("adress2")>0){ adress2 = str2.substring( ("'adress2=").length+1 , str2.length-1 ); } if(str2.indexOf("adress3")>0){ adress3 = str2.substring( ("'adress3=").length+1 , str2.length-1 ); } if(str2.indexOf("phone")>0){ phone = str2.substring( ("'phone=").length+1 , str2.length-1 ); } if(str2.indexOf("userid")>0){ userid = str2.substring( ("'userid=").length+1 , str2.length-1 ); } }); console.log ("firstname:" + firstname); console.log ("lastname:" + lastname); console.log ("adressno:" + adressno); console.log ("adress1:" + adress1); console.log ("adress2:" + adress2); console.log ("adress3:" + adress3); console.log ("phone:" + phone); console.log ("userid:" + userid); document.getElementById("firstname").value=firstname; document.getElementById("lastname").value=lastname; document.getElementById("adressno").value=adressno; document.getElementById("adress1").value=adress1; document.getElementById("adress2").value=adress2; document.getElementById("adress3").value=adress3; document.getElementById("phone").value=phone; document.getElementById("userid").value=userid; } </script> </head> <body onload="nyuuryokuzumi()"> <p id="center"> <img src="ラックロゴ.png"> </p> <form method="post"> <div id="center"> <p><span class ="s16" >基本情報入力</span></p> </br> <p><span class ="s14" >お名前</span></p> <div align = "center"><table> <td><tr><p>姓(漢字)<input type="text" name="firstname" id="firstname"/></tr></td> <td><tr><p>名(漢字)<input type="text" name="lastname" id="lastname"/></tr></td> <br/> <p><span class ="s16" >ご住所</span></p> <P><span class ="s14">郵便番号の"-"は入力しないで下さい。</span></P> <td><tr><p>郵便番号<input type="text" name="adressno" id="adressno" onchange="isRegNum(this)" /></p></tr><td> <td><tr><p>住所1<input type="text" name="adress1" id="adress1"/></p></tr></td> <td><tr><p>住所2<input type="text" name="adress2" id="adress2" /></tr><td> <td><tr><p>住所3<input type="text" name="adress3" id="adress3" /> </p></tr></td> <br/> <span class ="s14" >お電話番号</span> -は入力しないでください <td><tr><p>電話番号<input type="text" name="phone" id="phone" onchange="isRegNum(this)" /></p></tr></td> <div id="center"><img src="100x25.png"></div> <p><span class ="s14" >ユーザーID(メールアドレス)</span></p> <td><tr><p>ユーザーID<input type="text" id="userid" name = "userid" id="userid" onchange="checkMail()"/></tr></td> <div id="center"><img src="100x25.png"></div> <span class ="s14" ><p>パスワード(半角英数字)</p></span> <td><tr><p>パスワード<input type="password" name = "password1" id="password1" onblur="checkStr()"></p></tr><td> </br> <td><tr><p>もう一度 <input type="password" id="password2" onblur="checkStr()"></p></tr></td> </table></div> <div align="center"><img src="100x25.png"></div> <div align="center"> <a style="text-decoration:none;" onclick="page_jump()"> <button class="button">登録</button></a></div></br> </div> </form> </table> </body> </html>

本来はボタンを押すとfunction nyuuryokuzumi()に飛ぶのですが、検証のため、直接page_jump()に飛ぶようにしています。
page_jump()中のalert文はhello1,hello2とも動作確認出来ます。
よってwinndow.location.href文が動作していない事がわかります。
よろしくお願い致します。

気になる質問をクリップする

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

aタグのhref属性を削除してください。

HTML

1 2<div align="center"> 3 <a style="text-decoration:none;" onClick="checkkuhaku()"> 4 <button class="button">登録</button> 5 </a> 6 </br> 7</div> 8

JavaScript

1 2function checkkuhaku(){ 3 page_jump(); 4 return false; 5} 6 7function page_jump(){ 8 window.location.href='https://google.co.jp'; 9 return false; 10} 11

サンプル

投稿2019/11/20 04:07

編集2019/11/20 04:30
kyoya0819

総合スコア10429

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kyoya0819

2019/11/20 04:16

CodePenの制限で動かなかったようです。 ご指摘ありがとうございます。 修正します。
miyabi_takatsuk

2019/11/20 04:58 編集

なるほど、CodePenでしたか! たまに、本物と違う動作するときがあるのですね・・・。 して、私もにらんだとおり、hrefっぽいのですね。 (デフォルトのHTMLの仕様が優先して動いてたっぽそう)
kyoya0819

2019/11/20 04:58 編集

しばらく放置しておくと治りました。 なにか不具合があったようです。
miyabi_takatsuk

2019/11/20 04:59

なんと 汗 そういうこともあるのか・・・。
guest

0

ベストアンサー

buttonをformで囲っているんだとしたら単純にsubmitが走っているだけではないですか?
buttonタグの属性については検索すると出てくるので調べてみてください

投稿2019/11/20 04:53

hentaiman

総合スコア6426

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

masakifukuta

2019/11/20 05:39

回答有難うございました。</form>の位置を変えてみましたが駄目でした
hentaiman

2019/11/20 05:47 編集

どう変えたんですか?編集後の通りのhtmlだとしたらsubmit動きますよ とりあえずbutton type="button"にしてsubmitが原因かどうか確認してはどうでしょうか
miyabi_takatsuk

2019/11/20 05:49

最終コード、formありだったのか・・・。
masakifukuta

2019/11/20 05:57

</form>をbuttonより上にしてform範囲からbuttonを外してみました。
masakifukuta

2019/11/20 06:43

button type="button"と追加したら動作しました。 有難うございました。
guest

0

以下のいずれか、または複数をお試しください。

  • onClick → onclickにする。
  • a要素のhref属性をトル。
  • page_jump関数内のreturn false;をトル
  • customer_information.phpへの相対パスが合っているか確認する。

投稿2019/11/20 04:09

編集2019/11/20 05:01
miyabi_takatsuk

総合スコア9555

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miyabi_takatsuk

2019/11/20 04:55

ご指摘ありがとうございます。 回答を修正いたしました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問