Melaksanakan Pemasa Kira-kira JavaScript Dalam Aplikasi Kuiz Dalam Talian

Dalam catatan ini, kami akan memperluaskan aplikasi kuiz kami dan menambahkan fungsi pemasa undur JavaScript ke dalamnya. Perkara lain yang akan kami laksanakan di sini adalah, menambahkan kod supaya setiap kuiz dapat mempunyai jumlah soalan yang berbeza. Sekiranya anda belum membaca bahagian pertama, saya akan mengesyorkan anda membacanya. Lebih mudah bagi anda untuk mengikuti catatan ini dan memahaminya sepenuhnya.

Anda boleh membaca bahagian pertama di sini .Anda juga dapat mengembangkan peluang kerjaya Angular dengan mengambil .

Pemasa undur JavaScript

Tempoh masa setiap kuiz disimpan dalam fail XML kuis, kami mengambil jangka masa kuiz dan menyimpannya dalam sesi pengguna sebagai atribut. Semasa pengguna mengajukan pertanyaan, kami juga menyerahkan waktu kepada pengawal menggunakan pengiriman formulir khusus dengan JavaScript. Oleh itu, apabila kita menunjukkan soalan seterusnya, kita akan menunjukkan baki masa yang betul.

Apabila jangka masa kuiz berakhir, pengguna akan ditunjukkan kotak amaran yang mengatakan 'Time Up' dan kuis akan dinilai dan hasil akhir akan ditampilkan.

Mari kita lihat apa yang kita perlukan untuk mencapainya.

Kami telah menambah dua baris baru dalam fail kuiz XML, sebelum soalan kuiz.

Kuiz Java (2015/01/18) 10 2 Sintaks manakah yang betul? kelas awam ABC meluaskan QWE meluaskan Pelajar int i = 'A' String s = 'Hello' kelas peribadi ABC 2 Antara berikut, yang manakah bukan kata kunci di Java? antara muka kelas meluaskan pengabstrakan 3 Apa yang benar mengenai Java? Java adalah platform khusus Java tidak menyokong pelbagai warisan Java tidak berjalan di Linux dan Mac Java bukan bahasa multi-utas 1 Antara berikut, yang manakah antara muka? Thread Runnable Date Calendar 1 Syarikat mana yang mengeluarkan Java Versi 8? Sun Oracle Adobe Google 1 Java termasuk dalam kategori bahasa mana? Bahasa Generasi Pertama Bahasa Generasi Kedua Bahasa Generasi Ketiga Bahasa Generasi Keempat 2 Mana pakej lalai yang secara automatik dapat dilihat oleh program anda? java.net javax.swing java.io java.lang 3 Entri mana dalam WEB-INF yang digunakan untuk memetakan servlet? servlet-pemetaan servlet-pendaftaran servlet-entri servlet-lampiran 0 Berapakah panjang jenis data Java int? 32 bit 16 bit 64 bit Runtime khusus 0 Apakah nilai lalai boolean jenis data Java? benar palsu 1 0 1

Menetapkan Pemasa Semasa Memulakan Peperiksaan Baru

Apabila pengguna memulakan peperiksaan baru, kami menetapkan jumlah soalan dan tempoh kuiz dalam sesi pengguna sebagai atribut.

request.getSession (). setAttribute ('totalNumberOfQuizQuestions', document.getElementsByTagName ('totalQuizQuestions'). item (0) .getTextContent ()) request.getSession (). setAttribute ('quizDuration', document.getElementsByTag. .item (0) .getTextContent ()) request.getSession (). setAttribute ('min', document.getElementsByTagName ('quizDuration'). item (0) .getTextContent ()) request.getSession (). setAttribute ('sec ', 0)

Waktu undur

Kita harus mengurangkan pemasa setelah setiap detik, untuk melakukan itu kita akan membuat fungsi Javascript yang akan dipanggil pertama kali ketika halaman peperiksaan dimuat dan kemudian kita akan memanggil fungsi tersebut secara berulang setelah setiap detik ke waktu mundur.

Fungsi javascript untuk waktu undur

var tim var min = '$ {sessionScope.min}' var sec = '$ {sessionScope.sec}' var f = new Date () function customSubmit (someValue) {document.questionForm.minute.value = min document.questionForm. second.value = sec document.questionForm.submit ()} function examTimer () {if (parseInt (sec)> 0) {document.getElementById ('showtime'). innerHTML = 'Sisa Masa:' + min + 'Minutes,' + sec + 'Seconds' sec = parseInt (sec) - 1 tim = setTimeout ('examTimer ()', 1000)} lain {if (parseInt (min) == 0 && parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Time Sisa:' + min + 'Minutes,' + sec + 'Seconds' alert ('Time Up') document.questionForm.minute.value = 0 document.questionForm.second.value = 0 dokumen .questionForm.submit ()} if (parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Time Sisa:' + min + 'Minutes,' + sec + 'Seconds' min = parseInt (min ) - 1 saat = 59 tim = setTimeout ('examTimer ()', 1000)}}}

Cara Memanggil Fungsi Javascript

Sekarang, untuk memanggil fungsi Javascript, kita akan menggunakan atribut onload dari tag badan.

Menyerahkan Waktu Kuiz kepada Pengawal Peperiksaan

Sehingga sekarang kami menyerahkan borang pertanyaan kuiz secara langsung kepada Pengawal Peperiksaan, tetapi sekarang kami harus mengirimkan parameter pemasa: menit dan detik juga sehingga ketika Pengawal Ujian memaparkan pertanyaan berikutnya, ia juga harus menunjukkan waktu yang tersisa. Untuk mencapai itu, kami telah menghantar borang secara manual menggunakan Javascript dan menghantar parameter min dan saat ke Controller Exam.

perduaan hingga perpuluhan dalam java

Mengemukakan Borang Menggunakan Javascript

Perhatikan bahawa apabila pengguna klik pada butang berikutnya, sebelumnya atau selesai customSubmit () fungsi Javascript akan dipanggil.

$ {pilihan} 
  
0} '>
Mengendalikan Masa Terus
Apabila jangka masa kuiz berakhir, dengan kata lain ketika kedua dan kedua menjadi sifar. Kami menunjukkan kotak amaran yang bertuliskan 'Time Up' dan menetapkan nilai minit dan detik menjadi sifar dan menyerahkan borang.
if (parseInt (min) == 0 && parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Time Sisa:' + min + 'Minutes,' + sec + 'Seconds' alert ('Time Naik ') document.questionForm.minute.value = 0 document.questionForm.second.value = 0 document.questionForm.submit ()}
Kita harus menukar kodnya supaya peperiksaan akan selesai apabila had masa peperiksaan berakhir.
lain jika ('Finish Exam'.equals (action) || (minit == 0 && second == 0)) {finish = true int result = exam.calculateResult (exam) request.setAttribute (' hasil ', hasil) permintaan .getSession (). setAttribute ('currentExam', null) request.getRequestDispatcher ('/ WEB-INF / jsps / result.jsp'). maju (permintaan, respons)}
Oleh itu, peperiksaan boleh diselesaikan sama ada dengan mengklik butang penamat secara langsung atau apabila had masa peperiksaan berakhir (minit dan kedua menjadi sifar).
Itu sahaja untuk siaran ini. Pada posting seterusnya, kami akan melanjutkan aplikasi kuiz kami dan menambah ciri baru sehingga pengguna dapat menyemak jawapannya dan mengetahui soalan yang salahnya dan jawapan apa yang betul.
Seperti biasa anda boleh memuat turun kodnya, ubahnya sesuka hati. Itulah kaedah terbaik untuk memahami kod tersebut. Sekiranya anda mempunyai pertanyaan atau permintaan, sila komen di bawah.
Klik pada butang muat turun untuk memuat turun kod.
 Ada soalan untuk kami? Sila sebutkan di bahagian komen dan kami akan menghubungi anda. 
 Catatan berkaitan: 
kaedah overloading dan overriding dalam contoh java