JavaScriptの入門書を使って学習していた際に、うまく作動しない部分が出てきてしまい考えても解決しなかったので質問させていただきました。
内容としてはhtmlページを2つを用意し、1つ目のページにはアンケート内容、2つ目には回答した際のリンク先となるページを作成します。
それらをcookieを使って2回目以降の回答をできなくするというものです。
そして僕が解決できなかった点が、
1つ目のhtmlページのコーディングに誤りがあるためか、アンケートに回答し送信してもうまく別ページに飛べないという点です。
(質問させていただくのが初めてなので、適切な情報を記載できなていないかもしれませんが、よろしくお願いいたします。)
発生している問題・エラーメッセージ
コンソールを確認すると以下のような表示がでるのですが、 細かく確認しても終了タグをはじめとするすべてのタグの始まりと終わりを確認できたため、 何が誤りなのかを理解することができませんでした。 HTML1300: ナビゲーションが発生しました。 index.html (1,1) HTML1509: 終了タグが対応しません。 index.html (26,5) HTML1508: 終了タグが対応しません。 index.html (27,1)
該当のソースコード
**【1ページ目】** <!doctype html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <title>template</title> <link href="../../_common/css/style.css" rel="stylesheet" type="text/css"> </head> <body> <header> <div class="header-contents"> <h1>タイトル</h1> <h2>サブタイトル</h2> </div><!-- /.header-contents --> </header> <div class="main-wrapper"> <section> <p>映画館に行きますか?</p> <form id="form" action= "thankyou.html"> <input type= "radio" name= "frequency">週に1回以上<br> <input type= "radio" name= "frequency">月に1回くらい<br> <input type= "radio" name= "frequency">1年に数回程度<br> <input type= "radio" name= "frequency">ほとんど行かない・映画は観ない<br> <input type= "submit" name= "送信する" id= "submit"><br> </form> </section> </div><!-- /.main-wrapper --> <footer>JavaScript Samples</footer> <script src="../../_common/scripts/js.cookie.js"></script> <script> document.getElementById('form').onsubmit=function(){ if(Cookies.get('answerd')==='yes'){ window.alert('回答済みです。アンケートの回答は1回しかできません。'); return false; }else{ Cookies.set('answerd','yes',{expires: 7}); } }; </script> </body> </html> **【2ページ目】** <!doctype html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <title>template</title> <link href="../../_common/css/style.css" rel="stylesheet" type="text/css"> </head> <body> <header> <div class="header-contents"> <h1>タイトル</h1> <h2>サブタイトル</h2> </div><!-- /.header-contents --> </header> <div class="main-wrapper"> <section> <p>ありがとうございました。</p> </section> </div><!-- /.main-wrapper --> <footer>JavaScript Samples</footer> </body> </html>
試したこと
・コードのスペル等の確認
・すべての開始タグ、終了タグの確認
・保存されているファイル名とコーディング内容のファイル名に相違はないか
・リンクしているファイルの階層指定に相違はないか
補足情報(FW/ツールのバージョンなど)
PC :windows10
テキストエディタ:Brackets
ブラウザ :MicrosoftEdge
使用参考書 :確かな力が身につくJavaScript「超」入門 5-3
回答1件
あなたの回答
tips
プレビュー