<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>中西医答题试卷</title>
<style>
body {
font-family: "Microsoft YaHei", sans-serif;
max-width: 1000px;
margin: 0 auto;
padding: 20px;
background-color: #f5f5f5;
}
.header {
text-align: center;
margin-bottom: 30px;
background-color: #4CAF50;
color: white;
padding: 15px;
border-radius: 8px;
}
.timer-score {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
font-size: 18px;
}
.question-container {
background-color: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
margin-bottom: 20px;
}
.question {
font-weight: bold;
font-size: 18px;
margin-bottom: 15px;
}
.options {
margin-left: 20px;
}
.option {
margin-bottom: 10px;
cursor: pointer;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
}
.option:hover {
background-color: #f0f0f0;
}
.option.selected {
background-color: #e6f7ff;
border-color: #2196F3;
}
.option.correct {
background-color: #d4edda;
border-color: #c3e6cb;
}
.option.wrong {
background-color: #f8d7da;
border-color: #f5c6cb;
}
.submit-btn {
background-color: #2196F3;
color: white;
border: none;
padding: 12px 24px;
font-size: 16px;
border-radius: 4px;
cursor: pointer;
display: block;
margin: 30px auto;
}
.submit-btn:hover {
background-color: #0b7dda;
}
.result {
text-align: center;
margin-top: 30px;
padding: 20px;
border-radius: 8px;
display: none;
}
.result.success {
background-color: #d4edda;
}
.result.fail {
background-color: #f8d7da;
}
.footer {
text-align: center;
margin-top: 40px;
color: #666;
font-size: 14px;
}
</style>
</head>
<body>
<div class="header">
<h1>中西医知识测试</h1>
<h5>注意：本页面由周刚孺制作如有问题请反馈！</h5>
<p>总分100分 | 答题时间90分钟 | 请认真作答</p>
</div>
<div class="timer-score">
<div id="timer">剩余时间: 90:00</div>
</div>
<div id="questions-container">
<!-- 题目将通过JavaScript动态生成 -->
</div>
<button id="submit-btn" class="submit-btn">提交试卷</button>
<div id="result" class="result">
<h2 id="result-title"></h2>
<p id="result-score"></p>
<p id="result-detail"></p>
</div>
<div class="footer">
<p>中西医知识测试系统 © 2025</p>
</div>
<script>
// 中西医题目数据
const questions = [
{
id: 1,
question: "下列哪项不属于中医五行理论中的五行？",
options: ["金", "木", "水", "火", "土", "气"],
correct: 5, // 选项索引从0开始
score: 5
},
{
id: 2,
question: "中医认为人体的“五脏”不包括下列哪项？",
options: ["心", "肝", "脾", "胃", "肺", "肾"],
correct: 3,
score: 5
},
{
id: 3,
question: "下列哪味中药不属于“四君子汤”的组成？",
options: ["人参", "白术", "茯苓", "甘草", "黄芪", "当归"],
correct: 4,
score: 5
},
{
id: 4,
question: "西医中，人体最大的器官是？",
options: ["肝脏", "心脏", "肺", "皮肤", "肾脏", "脾脏"],
correct: 3,
score: 5
},
{
id: 5,
question: "下列哪项不是中医望诊的内容？",
options: ["望面色", "望舌苔", "望形态", "望二便", "望指纹", "望血压"],
correct: 5,
score: 5
},
{
id: 6,
question: "西医中，人体骨骼共有多少块？",
options: ["204", "205", "206", "207", "208", "209"],
correct: 2,
score: 5
},
{
id: 7,
question: "中医“六腑”不包括下列哪项？",
options: ["胆", "胃", "大肠", "小肠", "膀胱", "三焦", "子宫"],
correct: 6,
score: 5
},
{
id: 8,
question: "下列哪项属于西医中的内分泌系统？",
options: ["甲状腺", "肝脏", "心脏", "肺", "胃", "肠"],
correct: 0,
score: 5
},
{
id: 9,
question: "中医理论中，“气血”的“气”不包括下列哪项？",
options: ["元气", "宗气", "营气", "卫气", "精气", "氧气"],
correct: 5,
score: 5
},
{
id: 10,
question: "西医中，血液循环的动力器官是？",
options: ["心脏", "肺", "肝脏", "肾脏", "脾脏", "胃"],
correct: 0,
score: 5
},
{
id: 11,
question: "下列哪项不属于中医“四诊”？",
options: ["望", "闻", "问", "切", "触", "叩"],
correct: 4,
score: 5
},
{
id: 12,
question: "西医中，人体免疫系统的重要器官是？",
options: ["淋巴结", "肝脏", "心脏", "肺", "胃", "肠"],
correct: 0,
score: 5
},
{
id: 13,
question: "中医认为“肾”的主要功能不包括下列哪项？",
options: ["藏精", "主水", "主纳气", "主生殖", "主血脉", "主骨生髓"],
correct: 4,
score: 5
},
{
id: 14,
question: "下列哪项属于西医中的呼吸系统？",
options: ["肺", "心脏", "肝脏", "肾脏", "胃", "肠"],
correct: 0,
score: 5
},
{
id: 15,
question: "中医“七情”致病不包括下列哪项？",
options: ["喜", "怒", "忧", "思", "悲", "恐", "惊", "乐"],
correct: 7,
score: 5
},
{
id: 16,
question: "西医中，人体消化系统的起始器官是？",
options: ["口腔", "食道", "胃", "小肠", "大肠", "肛门"],
correct: 0,
score: 5
},
{
id: 17,
question: "下列哪项不属于中医“六淫”致病因素？",
options: ["风", "寒", "暑", "湿", "燥", "火", "热"],
correct: 6,
score: 5
},
{
id: 18,
question: "西医中，人体泌尿系统的主要器官是？",
options: ["肾脏", "心脏", "肺", "肝脏", "胃", "肠"],
correct: 0,
score: 5
},
{
id: 19,
question: "中医“五味”不包括下列哪项？",
options: ["酸", "苦", "甘", "辛", "咸", "辣"],
correct: 5,
score: 5
},
{
id: 20,
question: "西医中，人体神经系统的最高级中枢是？",
options: ["大脑", "小脑", "脑干", "脊髓", "神经", "神经元"],
correct: 0,
score: 5
}
];
// 全局变量
let currentScore = 0;
let selectedAnswers = {};
let timeLeft = 90 * 60; // 90分钟转换为秒
let timerInterval;
let selectedQuestions = [];
const totalQuestions = 20; // 总题目数
const questionsPerTest = 10; // 每次测试的题目数
// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
// 随机选择题目
selectRandomQuestions();
// 生成题目
generateQuestions();
// 启动计时器
startTimer();
// 绑定提交按钮事件
document.getElementById('submit-btn').addEventListener('click', submitTest);
});
// 随机选择题目
function selectRandomQuestions() {
const shuffled = [...questions].sort(() => 0.5 - Math.random());
selectedQuestions = shuffled.slice(0, questionsPerTest);
}
// 生成题目
function generateQuestions() {
const container = document.getElementById('questions-container');
container.innerHTML = '';
selectedQuestions.forEach((question, index) => {
const questionDiv = document.createElement('div');
questionDiv.className = 'question-container';
questionDiv.id = `question-${index}`;
let questionHtml = `
<div class="question">${index + 1}. ${question.question}</div>
<div class="options">
`;
question.options.forEach((option, optIndex) => {
questionHtml += `
<div class="option" data-question-index="${index}" data-option-index="${optIndex}">
${String.fromCharCode(65 + optIndex)}. ${option}
</div>
`;
});
questionHtml += `</div>`;
questionDiv.innerHTML = questionHtml;
container.appendChild(questionDiv);
});
// 绑定选项点击事件
document.querySelectorAll('.option').forEach(option => {
option.addEventListener('click', function() {
// 取消同一题目的其他选项选中状态
const questionIndex = this.getAttribute('data-question-index');
document.querySelectorAll(`#question-${questionIndex} .option`).forEach(opt => {
opt.classList.remove('selected');
});
// 设置当前选项为选中
this.classList.add('selected');
// 记录答案
selectedAnswers[questionIndex] = this.getAttribute('data-option-index');
});
});
}
// 启动计时器
function startTimer() {
updateTimerDisplay();
timerInterval = setInterval(() => {
timeLeft--;
updateTimerDisplay();
if (timeLeft <= 0) {
clearInterval(timerInterval);
submitTest();
}
}, 1000);
}
// 更新计时器显示
function updateTimerDisplay() {
const minutes = Math.floor(timeLeft / 60);
const seconds = timeLeft % 60;
document.getElementById('timer').textContent = `剩余时间: ${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
}
// 提交测试
function submitTest() {
clearInterval(timerInterval); // 停止计时器
// 检查所有题目是否已作答
let allAnswered = true;
for (let i = 0; i < questionsPerTest; i++) {
if (!(i in selectedAnswers)) {
allAnswered = false;
break;
}
}
if (!allAnswered) {
alert('请回答所有题目后再提交！');
return;
}
// 计算分数
currentScore = 0;
let correctCount = 0;
selectedQuestions.forEach((question, index) => {
const userAnswer = parseInt(selectedAnswers[index]);
const isCorrect = userAnswer === question.correct;
if (isCorrect) {
currentScore += question.score;
correctCount++;
}
// 显示正确/错误状态
const questionDiv = document.getElementById(`question-${index}`);
const options = questionDiv.querySelectorAll('.option');
options.forEach((option, optIndex) => {
if (optIndex === question.correct) {
option.classList.add('correct');
}
if (optIndex === userAnswer) {
if (isCorrect) {
option.classList.add('correct');
} else {
option.classList.add('wrong');
}
}
});
});
// 显示结果
showResult();
}
// 显示结果
function showResult() {
const resultDiv = document.getElementById('result');
const resultTitle = document.getElementById('result-title');
const resultScore = document.getElementById('result-score');
const resultDetail = document.getElementById('result-detail');
resultTitle.textContent = '测试结果';
resultScore.textContent = `你的得分: ${currentScore}/${questionsPerTest * 5}`;
let detail = `你答对了 ${currentScore / 5} 道题，共获得 ${currentScore} 分。\n\n`;
detail += currentScore >= 60 ? '恭喜你，通过了测试！' : '很遗憾，未通过测试，继续努力哦！';
resultDetail.textContent = detail;
resultDiv.className = `result ${currentScore >= 60 ? 'success' : 'fail'}`;
resultDiv.style.display = 'block';
// 隐藏提交按钮
document.getElementById('submit-btn').style.display = 'none';
}
</script>
</body>
</html>
index.html
index.html