Merge branch 'main' of http://10.10.14.176:3000/huanghai/dsProject
This commit is contained in:
@@ -501,4 +501,11 @@ select {
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* 在physics_quiz.css中添加多选题提示样式 */
|
||||
.multiple-choice {
|
||||
color: #2196f3;
|
||||
font-size: 0.9em;
|
||||
font-weight: normal;
|
||||
}
|
||||
@@ -102,7 +102,7 @@
|
||||
</div>
|
||||
|
||||
<div>
|
||||
有权限问题的话，请点击<a href="https://dsideal.obs.cn-north-1.myhuaweicloud.com/HuangHai/11%E3%80%81%E5%AD%A6%E4%BC%B4Chrome%E5%BD%95%E9%9F%B3%E9%85%8D%E7%BD%AE%E4%BF%AE%E6%94%B9.pdf">这里</a>
|
||||
<a href="https://dsideal.obs.cn-north-1.myhuaweicloud.com/HuangHai/11%E3%80%81%E5%AD%A6%E4%BC%B4Chrome%E5%BD%95%E9%9F%B3%E9%85%8D%E7%BD%AE%E4%BF%AE%E6%94%B9.pdf">有权限问题？</a>
|
||||
</div>
|
||||
|
||||
<!-- 引入看板娘相关脚本 -->
|
||||
|
||||
@@ -314,143 +314,170 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
}
|
||||
|
||||
// 提交当前难度的答案
|
||||
// 修改提交按钮的事件处理逻辑
|
||||
submitBtn.addEventListener('click', function() {
|
||||
const currentAnswers = correctAnswers[quizState.currentDifficulty];
|
||||
const totalQuestions = Object.keys(currentAnswers).length;
|
||||
let score = 0;
|
||||
let correct = 0;
|
||||
let incorrect = 0;
|
||||
const currentAnswers = correctAnswers[quizState.currentDifficulty];
|
||||
const totalQuestions = Object.keys(currentAnswers).length;
|
||||
let score = 0;
|
||||
let correct = 0;
|
||||
let incorrect = 0;
|
||||
|
||||
// 检查所有问题的答案
|
||||
for (const [questionName, correctOptions] of Object.entries(currentAnswers)) {
|
||||
// 获取用户选择的所有选项
|
||||
const selectedOptions = Array.from(document.querySelectorAll(`input[name="${questionName}"]:checked`))
|
||||
.map(checkbox => checkbox.value);
|
||||
|
||||
const questionNumber = questionName.substring(2); // 从mq1提取1
|
||||
const explanationElement = document.querySelector(`[data-difficulty="${quizState.currentDifficulty}"][data-question="${questionNumber}"] .question-explanation`);
|
||||
|
||||
// 显示解析
|
||||
explanationElement.style.display = 'block';
|
||||
|
||||
if (selectedOptions.length > 0) {
|
||||
// 标记用户选择的选项
|
||||
let allCorrect = true;
|
||||
|
||||
// 标记用户选择的每个选项
|
||||
document.querySelectorAll(`input[name="${questionName}"]:checked`).forEach(checkbox => {
|
||||
const userAnswer = checkbox.value;
|
||||
if (correctOptions.includes(userAnswer)) {
|
||||
checkbox.closest('.option').style.backgroundColor = '#e8f5e9';
|
||||
checkbox.closest('.option').style.borderColor = '#4caf50';
|
||||
} else {
|
||||
checkbox.closest('.option').style.backgroundColor = '#ffebee';
|
||||
checkbox.closest('.option').style.borderColor = '#c62828';
|
||||
allCorrect = false;
|
||||
}
|
||||
});
|
||||
|
||||
// 标记用户未选择但正确的选项
|
||||
document.querySelectorAll(`input[name="${questionName}"]`).forEach(checkbox => {
|
||||
if (correctOptions.includes(checkbox.value) && !checkbox.checked) {
|
||||
checkbox.closest('.option').style.backgroundColor = '#e3f2fd';
|
||||
checkbox.closest('.option').style.borderColor = '#2196f3';
|
||||
allCorrect = false;
|
||||
}
|
||||
});
|
||||
|
||||
// 判断是否全对
|
||||
if (allCorrect && selectedOptions.length === correctOptions.length) {
|
||||
score += 20; // 每题20分
|
||||
correct++;
|
||||
} else {
|
||||
incorrect++;
|
||||
}
|
||||
} else {
|
||||
// 未答题
|
||||
incorrect++;
|
||||
const questionElement = document.querySelector(`[data-difficulty="${quizState.currentDifficulty}"][data-question="${questionNumber}"]`);
|
||||
questionElement.style.border = '2px solid #ff9800';
|
||||
|
||||
// 显示所有正确答案
|
||||
document.querySelectorAll(`input[name="${questionName}"]`).forEach(checkbox => {
|
||||
if (correctOptions.includes(checkbox.value)) {
|
||||
checkbox.closest('.option').style.backgroundColor = '#e3f2fd';
|
||||
checkbox.closest('.option').style.borderColor = '#2196f3';
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 保存当前难度得分
|
||||
quizState.scores[quizState.currentDifficulty] = {
|
||||
score: score,
|
||||
correct: correct,
|
||||
incorrect: incorrect
|
||||
};
|
||||
quizState.completedDifficulties.push(quizState.currentDifficulty);
|
||||
|
||||
// 检查所有问题的答案
|
||||
for (const [questionName, correctAnswer] of Object.entries(currentAnswers)) {
|
||||
const selectedOption = document.querySelector(`input[name="${questionName}"]:checked`);
|
||||
const questionNumber = questionName.substring(2); // 从mq1提取1
|
||||
const explanationElement = document.querySelector(`[data-difficulty="${quizState.currentDifficulty}"][data-question="${questionNumber}"] .question-explanation`);
|
||||
// 显示当前难度结果
|
||||
scoreValue.textContent = score;
|
||||
correctCount.textContent = correct;
|
||||
incorrectCount.textContent = incorrect;
|
||||
result.style.display = 'block';
|
||||
|
||||
// 显示解析
|
||||
explanationElement.style.display = 'block';
|
||||
// 隐藏提交按钮
|
||||
submitBtn.style.display = 'none';
|
||||
|
||||
if (selectedOption) {
|
||||
const userAnswer = selectedOption.value;
|
||||
|
||||
// 标记正确或错误
|
||||
if (userAnswer === correctAnswer) {
|
||||
score += 20; // 每题20分
|
||||
correct++;
|
||||
selectedOption.closest('.option').style.backgroundColor = '#e8f5e9';
|
||||
selectedOption.closest('.option').style.borderColor = '#4caf50';
|
||||
} else {
|
||||
incorrect++;
|
||||
selectedOption.closest('.option').style.backgroundColor = '#ffebee';
|
||||
selectedOption.closest('.option').style.borderColor = '#c62828';
|
||||
// 标记正确答案
|
||||
const correctOption = document.querySelector(`input[name="${questionName}"][value="${correctAnswer}"]`);
|
||||
correctOption.closest('.option').style.backgroundColor = '#e8f5e9';
|
||||
correctOption.closest('.option').style.borderColor = '#4caf50';
|
||||
}
|
||||
} else {
|
||||
// 未答题
|
||||
incorrect++;
|
||||
const questionElement = document.querySelector(`[data-difficulty="${quizState.currentDifficulty}"][data-question="${questionNumber}"]`);
|
||||
questionElement.style.border = '2px solid #ff9800';
|
||||
}
|
||||
}
|
||||
|
||||
// 保存当前难度得分
|
||||
quizState.scores[quizState.currentDifficulty] = {
|
||||
score: score,
|
||||
correct: correct,
|
||||
incorrect: incorrect
|
||||
};
|
||||
quizState.completedDifficulties.push(quizState.currentDifficulty);
|
||||
|
||||
// 显示当前难度结果
|
||||
scoreValue.textContent = score;
|
||||
correctCount.textContent = correct;
|
||||
incorrectCount.textContent = incorrect;
|
||||
result.style.display = 'block';
|
||||
|
||||
// 隐藏提交按钮
|
||||
submitBtn.style.display = 'none';
|
||||
|
||||
// 根据当前难度和得分决定下一步
|
||||
if (quizState.currentDifficulty === 'medium') {
|
||||
if (correct < 3) {
|
||||
// 中等难度答对少于3题，推荐简单难度
|
||||
showNavigation('您在中等难度题目中表现不佳，建议先完成简单难度题目来巩固基础。', 'easy');
|
||||
} else {
|
||||
// 中等难度答对3题及以上，推荐高级难度
|
||||
showNavigation('恭喜您完成中等难度题目！接下来挑战高级难度题目吧。', 'hard');
|
||||
}
|
||||
} else {
|
||||
// 简单或高级难度完成后，显示最终结果
|
||||
showFinalResult();
|
||||
}
|
||||
// 根据当前难度和得分决定下一步
|
||||
if (quizState.currentDifficulty === 'medium') {
|
||||
if (correct < 3) {
|
||||
// 中等难度答对少于3题，推荐简单难度
|
||||
showNavigation('您在中等难度题目中表现不佳，建议先完成简单难度题目来巩固基础。', 'easy');
|
||||
} else {
|
||||
// 中等难度答对3题及以上，推荐高级难度
|
||||
showNavigation('恭喜您完成中等难度题目！接下来挑战高级难度题目吧。', 'hard');
|
||||
}
|
||||
} else {
|
||||
// 简单或高级难度完成后，显示最终结果
|
||||
showFinalResult();
|
||||
}
|
||||
});
|
||||
|
||||
// 显示导航信息
|
||||
function showNavigation(message, nextDifficulty) {
|
||||
navigationMessage.textContent = message;
|
||||
navigationSection.dataset.nextDifficulty = nextDifficulty;
|
||||
navigationSection.style.display = 'block';
|
||||
navigationMessage.textContent = message;
|
||||
navigationSection.dataset.nextDifficulty = nextDifficulty;
|
||||
navigationSection.style.display = 'block';
|
||||
}
|
||||
|
||||
// 开始下一组题目
|
||||
nextBtn.addEventListener('click', function() {
|
||||
const nextDifficulty = navigationSection.dataset.nextDifficulty;
|
||||
if (!nextDifficulty) return;
|
||||
const nextDifficulty = navigationSection.dataset.nextDifficulty;
|
||||
if (!nextDifficulty) return;
|
||||
|
||||
// 更新当前难度
|
||||
quizState.currentDifficulty = nextDifficulty;
|
||||
// 更新当前难度
|
||||
quizState.currentDifficulty = nextDifficulty;
|
||||
|
||||
// 隐藏导航和结果
|
||||
navigationSection.style.display = 'none';
|
||||
result.style.display = 'none';
|
||||
// 隐藏导航和结果
|
||||
navigationSection.style.display = 'none';
|
||||
result.style.display = 'none';
|
||||
|
||||
// 显示提交按钮
|
||||
submitBtn.style.display = 'inline-block';
|
||||
// 显示提交按钮
|
||||
submitBtn.style.display = 'inline-block';
|
||||
|
||||
// 更新难度指示器
|
||||
difficultyIndicator.textContent = `当前难度：${getDifficultyName(nextDifficulty)}`;
|
||||
difficultyIndicator.className = `difficulty-indicator difficulty-${nextDifficulty}`;
|
||||
// 更新难度指示器
|
||||
difficultyIndicator.textContent = `当前难度：${getDifficultyName(nextDifficulty)}`;
|
||||
difficultyIndicator.className = `difficulty-indicator difficulty-${nextDifficulty}`;
|
||||
|
||||
// 隐藏所有题目
|
||||
document.querySelectorAll('.question').forEach(question => {
|
||||
question.classList.add('hidden');
|
||||
});
|
||||
// 隐藏所有题目
|
||||
document.querySelectorAll('.question').forEach(question => {
|
||||
question.classList.add('hidden');
|
||||
});
|
||||
|
||||
// 显示下一组题目
|
||||
document.querySelectorAll(`[data-difficulty="${nextDifficulty}"]`).forEach(question => {
|
||||
question.classList.remove('hidden');
|
||||
});
|
||||
// 显示下一组题目
|
||||
document.querySelectorAll(`[data-difficulty="${nextDifficulty}"]`).forEach(question => {
|
||||
question.classList.remove('hidden');
|
||||
});
|
||||
|
||||
// 滚动到页面顶部
|
||||
window.scrollTo(0, 0);
|
||||
// 滚动到页面顶部
|
||||
window.scrollTo(0, 0);
|
||||
});
|
||||
|
||||
// 显示最终结果
|
||||
function showFinalResult() {
|
||||
// 计算总分
|
||||
let totalScore = 0;
|
||||
let totalCorrect = 0;
|
||||
let totalIncorrect = 0;
|
||||
// 计算总分
|
||||
let totalScore = 0;
|
||||
let totalCorrect = 0;
|
||||
let totalIncorrect = 0;
|
||||
|
||||
for (const difficulty of quizState.completedDifficulties) {
|
||||
totalScore += quizState.scores[difficulty].score;
|
||||
totalCorrect += quizState.scores[difficulty].correct;
|
||||
totalIncorrect += quizState.scores[difficulty].incorrect;
|
||||
}
|
||||
for (const difficulty of quizState.completedDifficulties) {
|
||||
totalScore += quizState.scores[difficulty].score;
|
||||
totalCorrect += quizState.scores[difficulty].correct;
|
||||
totalIncorrect += quizState.scores[difficulty].incorrect;
|
||||
}
|
||||
|
||||
// 更新结果显示
|
||||
scoreValue.textContent = totalScore;
|
||||
correctCount.textContent = totalCorrect;
|
||||
incorrectCount.textContent = totalIncorrect;
|
||||
result.style.display = 'block';
|
||||
// 更新结果显示
|
||||
scoreValue.textContent = totalScore;
|
||||
correctCount.textContent = totalCorrect;
|
||||
incorrectCount.textContent = totalIncorrect;
|
||||
result.style.display = 'block';
|
||||
|
||||
// 显示完成信息
|
||||
navigationMessage.textContent = '恭喜您完成所有推荐题目！';
|
||||
navigationSection.style.display = 'block';
|
||||
document.getElementById('next-btn').style.display = 'none';
|
||||
// 显示完成信息
|
||||
navigationMessage.textContent = '恭喜您完成所有推荐题目！';
|
||||
navigationSection.style.display = 'block';
|
||||
document.getElementById('next-btn').style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
@@ -487,15 +514,20 @@ function renderQuestions() {
|
||||
question.options.forEach(option => {
|
||||
optionsHTML += `
|
||||
<div class="option">
|
||||
<input type="radio" id="${option.id}" name="${question.id}" value="${option.label}">
|
||||
<input type="checkbox" id="${option.id}" name="${question.id}" value="${option.label}">
|
||||
<label for="${option.id}">${option.label}. ${option.text}</label>
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
|
||||
// 检查是否为多选题
|
||||
const isMultipleChoice = correctAnswers[question.difficulty] &&
|
||||
correctAnswers[question.difficulty][question.id] &&
|
||||
correctAnswers[question.difficulty][question.id].length > 1;
|
||||
|
||||
questionElement.innerHTML = `
|
||||
<div class="question-header">
|
||||
<h3>第${question.number}题 (${question.points}分)</h3>
|
||||
<h3>第${question.number}题 (${question.points}分)${isMultipleChoice ? ' <span class="multiple-choice">（多选题）</span>' : ''}</h3>
|
||||
</div>
|
||||
<div class="question-content">
|
||||
<p>${question.text}</p>
|
||||
|
||||
Reference in New Issue
Block a user