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

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

新規登録して質問してみよう
ただいま回答率
85.50%
MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

JavaScript

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

Q&A

解決済

1回答

1635閲覧

Chromeの検証モードで問題文を見えないようにする方法【クイズサイト】

chung

総合スコア11

MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

JavaScript

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

0グッド

0クリップ

投稿2018/11/25 12:20

dot installで3択クイズの作り方(javascript)について,下記のソースコードのように習ったのですが、
このままですとChromeの検証モードで問題内容や回答が外部からまる見えとなってしまいます。

現在、数百のデータを用意したクイズサイトを作っているのですが、外部から問題内容を見られないようにするには
どうすれば良いのでしょうか。(MySQLのようなデータベースを利用しなければならないのでしょうか)。

ご回答のほどよろしくお願いいたします。

(function() { 'use strict'; var question = document.getElementById('question'); var btn = document.getElementById('btn'); var answers = document.querySelectorAll('#answers > li'); var shuffledAnswers; var result = document.getElementById('result'); var scoreLabel = document.querySelector('#result > p'); var quizSet = [ {q: 'What is A?', a: ['A0', 'A1', 'A2']}, {q: 'What is B?', a: ['B0', 'B1', 'B2']}, {q: 'What is C?', a: ['C0', 'C1', 'C2']} ]; var currentNum = 0; var isAnswered; var score = 0; function shuffle(arr) { var i; var j; var tmp; for (i = arr.length - 1; i >= 0; i--) { j = Math.floor(Math.random() * (i + 1)); tmp = arr[i]; arr[i] = arr[j]; arr[j] = tmp; } return arr; } function setQuiz() { var i; question.textContent = quizSet[currentNum].q; shuffledAnswers = shuffle(quizSet[currentNum].a.slice()); isAnswered = false; for (i = 0; i < answers.length; i++) { answers[i].classList.remove('correct'); answers[i].classList.remove('wrong'); answers[i].textContent = shuffledAnswers[i]; } btn.classList.add('disabled'); if (currentNum === quizSet.length - 1) { btn.textContent = 'Show Score'; } } function setEvents() { var i; for (i = 0; i < answers.length; i++) { answers[i].addEventListener('click', function() { checkAnswer(this); }); } btn.addEventListener('click', function() { if (this.classList.contains('disabled')) { return; } // setQuiz(); if (currentNum === quizSet.length) { // show score // console.log('Score: ' + score + ' / ' + quizSet.length); scoreLabel.textContent = 'Score: ' + score + ' / ' + quizSet.length; result.classList.add('show'); } else { setQuiz(); } }); } function checkAnswer(node) { if (isAnswered) { return; } isAnswered = true; if (node.textContent === quizSet[currentNum].a[0]) { node.textContent += ' ... Correct!'; node.classList.add('correct'); score++; } else { node.textContent += ' ... Wrong!'; node.classList.add('wrong'); } btn.classList.remove('disabled'); currentNum++; } setQuiz(); setEvents(); })();

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

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

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

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

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

guest

回答1

0

ベストアンサー

データベースを利用しなければならない、というか
PHPのようなサーバー側の言語を利用しなければなりません。
問題と答えは別にデータベースに持つ必要はありませんが、
あったほうが管理がしやすいですし、コードをいじらなくても
問題・答えを画面から修正出来るように作ることもできる(あくまでそのように自分で作る)ので、
そこはどういう形で問題・答え・解答の結果を管理したいのかという要件によります。

投稿2018/11/25 12:25

m.ts10806

総合スコア80765

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

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

chung

2018/11/25 14:06

サーバー側の言語であれば、Chromeから見れないということですね。 ありがとうございます!
m.ts10806

2018/11/25 14:13

ちょっと安易な解釈してそうで怖いのですけど、 「サーバー側の言語の処理は」見れません。リクエストとレスポンスは確認できます。 サーバー側の言語で画面出力した情報はもちろんブラウザに出力されるので見れます。 そこをきちんと単に「OK」「NG」だけ返すように作るか、です。たぶん正しく理解できないとサーバー側の言語使う意味がありません。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問