Q&A
前提・実現したいこと
HTMLで作成した３つの要素に対してclickイベントを適用させようと思っており、さらに、clickされた要素によって
表示するアラートの種類を変更させようと思っており、なおかつjavascriptのif文を使うという条件で解決策を考えています。
発生している問題・エラーメッセージ
if_practice.js:7 Uncaught RangeError: Maximum call stack size exceeded
該当のソースコード
javascript
1"use strict"; 2function color(){ 3 var right = document.getElementById("purple"); 4 right.id = "clicked"; 5} 6function alert(){ 7 var notClicked = document.getElementsByClassName("purple"); 8 if(notClicked.id === "clicked"){ 9 alert('正解'); 10 }else{ 11 alert('不正解'); 12 } 13}
html
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>JavaScriptの</title> 7</head> 8<body> 9 <p>JavaScriptの条件分岐</p> 10 <h1>ぶどうの色は何色でしょうか（該当するものをクリック）。</h1> 11 <h2 onclick="alert()" id="red">1.赤</h2> 12 <h2 onclick="alert()" id="yellow">2.黄</h2> 13 <h2 onclick="color();alert();" id="purple" class="purple">3.紫</h2> 14 <script src="js/if_practice.js"></script><!--//フォルダ名jsの中のtask_if_1.jsというファイルを読み込む--> 15</body> 16</html>
試したこと
最初は3つめの要素に対して、idのみ設定していましたが、2つめの関数が動かないと思い、classも設定しました。
補足情報（FW/ツールのバージョンなど）
ここにより詳細な情報を記載してください。
回答1件
0
ベストアンサー
エラーメッセージのとおりです。
自分でalertという関数を作ったがために、この関数の中で呼び出されるalert('正解');なども同じ関数を呼び出すことになってしまい、無限に再帰が続いてしまっています。
投稿2020/12/24 08:56
総合スコア146018
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/12/24 09:07