Bagaimana untuk menetapkan had masa untuk menjawab soalan dalam talian-tutorial php-php.cn

Bagaimana untuk menetapkan had masa untuk menjawab soalan dalam talian

WBOY

Lepaskan： 2023-09-26 08:56:02

asal

1382 orang telah melayarinya

Bagaimana untuk menetapkan had masa untuk menjawab soalan dalam talian

Cara menetapkan had masa untuk menjawab soalan dalam menjawab dalam talian

Dengan populariti dan perkembangan Internet, semakin banyak institusi dan syarikat pendidikan telah mula menggunakan kaedah menjawab dalam talian untuk ujian dan pemilihan pengetahuan. Apabila menjawab soalan dalam talian, untuk memastikan keadilan dan penyeragaman, selalunya perlu menetapkan had masa untuk menjawab soalan. Artikel ini akan memperkenalkan cara menetapkan had masa untuk menjawab soalan dalam talian, termasuk contoh kod tertentu.

Dalam pembangunan web, teknologi seperti HTML, CSS dan JavaScript boleh digunakan untuk melaksanakan fungsi terhad masa untuk menjawab soalan. Langkah-langkah khusus adalah seperti berikut:

Buat halaman jawapan
Mula-mula, buat halaman jawapan, termasuk menjawab soalan, pilihan, butang hantar dan elemen lain. Anda boleh menggunakan bahasa HTML untuk menulis struktur halaman, seperti yang ditunjukkan di bawah:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>在线答题</title>
</head>
<body>
  <h1>答题题目</h1>
  <form id="answerForm">
    <input type="radio" name="option" value="option1">选项1<br>
    <input type="radio" name="option" value="option2">选项2<br>
    <input type="radio" name="option" value="option3">选项3<br>
    <input type="radio" name="option" value="option4">选项4<br>
  </form>
  <button id="submitBtn">提交</button>
</body>
</html>

Salin selepas log masuk

Tambah fungsi had masa menjawab soalan
Gunakan bahasa JavaScript untuk melaksanakan fungsi had masa menjawab soalan. Anda boleh melaksanakan kira detik dengan menetapkan fungsi pemasa dan menyerahkan jawapan secara automatik apabila masa tamat. Kod khusus adalah seperti berikut:

<script>
  // 计时器
  var timer;
  
  // 设置限时，单位为秒
  var timeLimit = 60;
  
  // 页面加载完成后开始计时
  window.onload = function() {
    startTimer();
  }
  
  // 开始计时
  function startTimer() {
    timer = setInterval(function() {
      timeLimit--;
      if (timeLimit == 0) {
        clearInterval(timer);
        submitAnswer();
      }
      updateTimer();
    }, 1000);
  }
  
  // 更新计时器显示
  function updateTimer() {
    document.getElementById("timer").innerHTML = "剩余时间：" + timeLimit + "秒";
  }
  
  // 提交答案
  function submitAnswer() {
    // 获取选中的选项
    var answer = document.querySelector('input[name="option"]:checked').value;
    // 提交答案的相关处理
    // ...
  }
</script>

Salin selepas log masuk

Tunjukkan kira detik
Tambahkan elemen untuk memaparkan kira detik pada halaman jawapan, seperti yang ditunjukkan di bawah:

<h2 id="timer"></h2>

Salin selepas log masuk

Dalam kod, kami menggunakan setInterval berfungsi setiap kali Mengurangkan baki masa dalam beberapa saat dan mengemas kini paparan kira detik melalui atribut innerHTML. setInterval函数每秒钟减少剩余时间，并通过innerHTML属性更新倒计时显示。

提交答案
在提交按钮的点击事件中调用submitAnswer

Panggil fungsi submitAnswer dalam acara klik butang serah untuk mendapatkan pilihan yang dipilih oleh pengguna dan lakukan pemprosesan yang berkaitan.

Melalui langkah di atas, kami telah berjaya melaksanakan fungsi terhad masa untuk menjawab soalan dalam talian. Selepas pengguna memasuki halaman jawapan, pemasa kira detik akan bermula, dan jawapan akan diserahkan secara automatik apabila masa tamat. Pada masa yang sama, baki masa kira detik juga akan dipaparkan pada halaman dalam masa nyata.

🎜Dalam sistem jawapan sebenar, lebih banyak fungsi boleh ditambah mengikut keperluan, seperti butang mula, butang jeda, dll. Saya harap artikel ini dapat membantu anda untuk menetapkan had masa menjawab dengan lebih baik apabila membangunkan sistem menjawab dalam talian. Saya doakan anda mendapat keputusan yang baik dengan sistem menjawab soalan dalam talian anda! 🎜

Atas ialah kandungan terperinci Bagaimana untuk menetapkan had masa untuk menjawab soalan dalam talian. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!