JavaScript画面遷移中断できない
- JavaScriptのコードで画面遷移の中断を試みましたが、うまくいかない問題が発生しています。
- 「本当に画面遷移してもいいですか？」にいいえを選択すると、遷移が中断されるべきですが、実際には遷移してしまいます。
- なぜこの問題が発生しているのか理解できず、解決策を知りたいです。
- ベストアンサー
JavaScript 遷移中止できない
下記のようなコードで 「本当に画面遷移してもいいですか？」にいいえを答えたら、 falseが返され、遷移が中断されるようにしたかったのですが、 遷移してしまいます。 なぜか考えてもわからないので、ご存知の方がいたら教えて頂きたいです。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> </head> <body> <a href="https://www.--------">サイトへ遷移します</a> <script language="javascript" type="text/javascript"> function func_check(){ if( confirm("本当に画面遷移してもいいですか？") ) { return true; } else { return false; } } </script> </body> </html>
- pppp4444
- お礼率42% (8/19)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
＞falseが返され、遷移が中断されるようにしたかったのですが、 ＞遷移してしまいます。 false を返すのはいいですが、中断する部分はどこでしょうか? trueを返そうが、falseを返そうが、<a href=URL> は動作してしまうため、画面遷移しているんだと思います。 なので、スクリプト内で「Yesなら、飛ぶ」(つまりNoなら、「何もしない」)という風に直してみたところ、こんなのができました。 func_check の引数にURLを入れれば、リンクごとに好きな飛び先を設定できます。 ※<script> が <head> 内にあるのは私の好みです。(スクリプト非対応のブラウザで表示したとき、本文にスクリプトが出たりしません。まあそんなブラウザ、いまどき無いでしょうけど) ---- <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <script language="javascript" type="text/javascript"> function func_check(url){ if( window.confirm("本当に画面遷移してもいいですか？") ) { location.href = url; } } </script> </head> <body> <a href="javascript:func_check('https://www.google.co.jp');">サイトへ遷移します</a> </body> </html>
関連するQ&A
- javascriptのconfirmについて
javascriptのconfirmが実行されると確認ダイアログボックスが表示されるはずですが、 何故か何も表示されず、必ずfalseを通ります。 かなり初心者的ミスを侵している気がしますが、調べても分からなかったので、 どなたかご教授頂ければ幸いです。記述したソースは以下になります。 headタグ内 <script type="text/javascript"> <!-- function confirm(s){ if(window.confirm('実行します')){ location.href = "/?flg="+s; } return false; } // --> </script> ■bodyタグ内 <a href="javascript:confirm('1');return false;">テスト</a>
- ベストアンサー
- JavaScript
- JavaScript表示切替の問題
ボタンを押すたびに、こんにちはとこんばんはが切り替わるようにしたいのですが、 切り替わりません。なぜかわかる方がいたら教えて頂けると助かります。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> </head> <body> <div id="1">こんにちは</div> <input type="button" value="切替" onclick="func_switch()"> <script language="javascript" type="text/javascript"> function func_switch(){ if(document.getElementById(1).innerHTML="こんにちは"){ document.getElementById(1).innerHTML="こんばんは"; } else{ document.getElementById(1).innerHTML="こんばんは"; } } </script> </body> </html>
- ベストアンサー
- JavaScript
- javascriptに詳しい方
下のスクリプトで見るべきページが二つ以上ある場合どのように記述すればいいのでしょうか? javascriptに詳しい方よろしくお願いいたします。 <html> <head> <script language="JavaScript"> <!-- var isClicked = false; //--> </script> </head> <body> <A href="check.html" onClick="isClicked = true">見るべきページ</a><br> <A href="test.html" onClick="if (!isClicked){ alert('先に見るべきページをクリックしてください'); return false; }">A</a><br> </body> </html>
- ベストアンサー
- JavaScript
- Event.observe について教えてください。
javascript および prototype.js について理解が中途半端なのですが、Event.observe() の 'click' 指定で、関数に引数を渡すにはどうしたらよいでしょうか？そんなことできないのでしょうか？ どういうことかといいますと、まず次のようなプログラムは動かすことが出来ました。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <script src="prototype.js" type="text/javascript"></script> </head> <body> test page <form name="form1"> <input type="button" name="exe" value="実行" id="b1" > </form> </body> </html> <script type="text/javascript"> function myfunc(){ return confirm('exe ?'); } Event.observe($('b1'), 'click', myfunc, false); </script> ------------------------------------- なのですが、この myfunc()関数に引数を与えれたらよいな、と思いまして、 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <script src="prototype.js" type="text/javascript"></script> </head> <body> test page <form name="form1"> <input type="button" name="exe" value="実行" id="b1" > </form> </body> </html> <script type="text/javascript"> function myfunc(a){ alert(a); return confirm('exe ?'); } Event.observe($('b1'), 'click', myfunc(3), false); </script> のようにしてみましたが、これは意図通り動かず、何故か画面をロードした時に、myfunc()関数も呼ばれているようです。 何分理解が中途半端なので、わたしがよく分かっていないことがあるのだと思いますが、どなたかご教授していただけたら嬉しいです。よろしくお願い致します。
- ベストアンサー
- JavaScript
- JavaScriptで九九
繰り返し処理を用いて画像のように表示させたい場合はどこを修正すればいいですか？ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>九九</title> </head> <body> <script> for (var i = 1; i <= 9; i++) { for (var j = 1; j <= 9; j++) { document.write(`${i} * ${j} = ${i*j}<br/>`); } } </script> </body> </html>
- 締切済み
- JavaScript
- JavaScriptで数値をimgに設定する
JavaScriptで 下記のソースにてランダムで出した数値を htmlの width="" height=""に 設定するには どのようにすればよいのでしょうか？ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <title></title> </head> <body> <script> var width = Math.floor(Math.random() * 400) + 1; var height = Math.floor(Math.random() * 400) + 1; </script> <img src="hoge.jpg" alt="" width="" height=""> </body> </html>
- ベストアンサー
- JavaScript
- 【servlet】フォワードを使った画面遷移
java,サーブレット初学者です。表題の通り、フォワード を使って画面遷移を試みています。 以下のコードを記述しリンクをクリックすると確かに画面遷移はできるのですが、 フォワードが出来ているならURLの最後が【/Test1】になるのではないかと考えました。 ですが実際は【/NewFile2】となっているため、フォワードが出来ていないのかと思います。 どの様にしたら前者のような結果になるでしょうか。 ご教授頂きたいです。 サーブレット↓ package sample; import java.io.IOException; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; @WebServlet("/Test1") public class Test1 extends HttpServlet { protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { RequestDispatcher br = request.getRequestDispatcher("html/NewFile2.html"); br.forward(request, response); } } 遷移前の画面↓ <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>テスト</title> </head> <body> <h2>sample</h2> <p>テストです</p> <a href ="/servlet_dayo/html/NewFile2.html">画面遷移する</a> </body> </html> 遷移先↓ <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>テスト</title> </head> <body> <p>遷移先</p> </body> </html> サーバー：Tomcat8.5 os：macos を使用しています。どうぞよろしくお願いします。 ※OKWAVEより補足：「Webシステム開発」についての質問です。
- ベストアンサー
- Java
- javascriptからのｐｈｐクラス関数の呼び出し
<?php /* * TESTPHP.INC */ class SelRecord { function ExeQuery($StrSQL) { @$result = pg_query(con, $sql); // selectを実行 if ($result == false) { printf("SQL($sql)の実行に失敗しました。理由: " . pg_last_error($this->con)); return false; } return $result; } ?> ----------------------------------------------------------------------------------- /* * root.php */ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> <html lang="ja"> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <script language="JavaScript"> <!-- function GetData() { $StrSQL = "SELECT * from tbl" ここからクラスSelRecordのExeQueryを呼び出すには、どのような記述を すればよいのでしょうか。よろしくお願いします。 } --> </script> <title>Sample</title> </HEAD> <BODY> </BODY> </HTML>
- 締切済み
- JavaScript
- 下記コードのようなオブジェクトとかprototypeとかを理解するヒントを教えてください！
<html> <head> <meta charset="utf-8"> </head> <body> <script type="text/javascript"> var hoge = function(){ //▼ function testFunc(n){ } testFunc.prototype.init = function(c){ alert(c); }// end func return{ testFunc:testFunc } }(); var u = new hoge.testFunc(); u.init("あああ"); </script> </body> </html> ---------------------------------------------------- ここ数日いろいろ弄っているのですが、 いまいちピンと来ない感じです。 何か、参考になるようなスクリプトやポイントなどありましたら、 ご紹介いただけると幸いです。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- JavaScriptのコードの間違いを教えて
いつもお世話になっております。 現在、JavaScriptの勉強をしているのですが、if構文のところでつまずいてしまいした。 下のコードがうまく実行できません。 間違いを指摘して頂ければと思います。 <doctype! html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Javascript</title> </head> <body> <script type="text/javascript"> var x = window.prompt("好きな値を入力してください","100"); if (x>100) {window.document.write("100より大きいです");} else {if(x<100)) {window.document.write("100より小さいです");} else {if(x=100)) {window.document.write("100です");} } } </script> </body> </html> なお、テキストエディタで記述し、実行はGoogleChromeで行いました。 よろしくお願いします。
- 締切済み
- その他（インターネット・Webサービス）
お礼
わかりやすくありがとうございます。