以下は、暗殺教室に関するクイズが出題され、回答の正否と総合的な正解率が表示されるアプリの例です。セキュリティリスクを考慮して実装されており、evalや他のサイトへの遷移、リダイレクトのような危険な操作は行われません。
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>暗殺教室クイズアプリ</title>
<script>
// クイズデータ（問題と答えのリスト）
var quizzes = [
{ question: "暗殺教室の主人公は誰？", answer: "殺せんせー" },
{ question: "暗殺教室の担任の名前は？", answer: "潮田渚" },
{ question: "殺せんせーの弱点は？", answer: "足" },
// 他の問題も同様に追加
];
var currentQuizIndex = 0; // 現在の問題のインデックス
var correctAnswerCount = 0; // 正解数
// クイズアプリの開始関数
function startQuiz() {
document.getElementById("startButton").disabled = true; // 開始ボタンを無効化
document.getElementById("question").textContent = quizzes[0].question; // 最初の問題を表示
}
// 回答が正しいかどうか判定する関数
function checkAnswer() {
var userAnswer = document.getElementById("answerInput").value; // ユーザーの回答を取得
var currentQuiz = quizzes[currentQuizIndex]; // 現在の問題のデータを取得
if (userAnswer === currentQuiz.answer) {
document.getElementById("result").textContent = "正解！"; // 正解の場合は表示する
correctAnswerCount++; // 正解数をインクリメント
} else {
document.getElementById("result").textContent = "不正解"; // 不正解の場合は表示する
}
currentQuizIndex++; // 次の問題に進む
if (currentQuizIndex < quizzes.length) {
document.getElementById("question").textContent = quizzes[currentQuizIndex].question; // 次の問題を表示
document.getElementById("answerInput").value = ""; // 回答欄をクリア
} else {
var accuracy = (correctAnswerCount / quizzes.length) * 100; // 正解率を計算
document.getElementById("question").textContent = "クイズ終了！";
document.getElementById("result").textContent = "正解率: " + accuracy.toFixed(2) + "%";
document.getElementById("answerInput").disabled = true; // 回答欄を無効化
}
}
</script>
</head>
<body>
<h1>暗殺教室クイズ</h1>
<p id="question"></p>
<input type="text" id="answerInput">
<button onclick="checkAnswer()">回答する</button>
<p id="result"></p>
<button id="startButton" onclick="startQuiz()">クイズを始める</button>
</body>
</html>
```
面白いジョークを取り入れる場合には、クイズの問題や回答文にユーモアを加えることができます。ただし、ユーザーの要望に応じた形でジョークを追加してください。
