bootstrap+vue实现一个简洁的在线考试答题系统代码-html代码-BFW代码库

bootstrap+vue实现一个简洁的在线考试答题系统代码

代码语言：html

所属分类：其他

代码描述：bootstrap+vue实现一个简洁的在线考试答题系统代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title>在线答题考试</title>
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.5.3.0.css">
</head>
<body>
 <div class="container my-5">
    <div id="app">
      <h1 class="text-center mb-4">在线答题考试</h1>
      <div class="row justify-content-center">
        <div class="col-md-4">
          <div class="card mb-4">
            <div class="card-body text-center">
              <h5 class="card-title">倒计时:</h5>
              <p class="card-text display-4">{{ formatTime(countdown) }}</p>
            </div>
          </div>
          <div class="card mb-4">
            <div class="card-body text-center">
              <h5 class="card-title">第 {{ current }} 题:</h5>
              <p class="card-text">{{ questions[current - 1].question }}</p>
            </div>
          </div>
          <div class="card mb-4">
            <div class="card-body">
              <h5 class="card-title">选项:</h5>
              <div class="form-check form-check" v-for="option in questions[current - 1].options">
                <label class="form-check-label">
                  <input type="radio" v-model="answers[current - 1]" :value="option" class="form-check-input">
                  {{ option }}
                </label>
              </div>
            </div>
          </div>
          <div class="d-grid gap-2">
            <button @click="prev" class="btn btn-outline-secondary" :disabled="current === 1">上一题</button>
            <button @click="next" class="btn btn-outline-secondary" :disabled="current === questions.length">下一题</button>
            <button @click="submit" class=.........完整代码请登录后点击上方下载按钮下载查看