<!DOCTYPE HTML><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head> <Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" /> <title>HTML5 Timer</title> <Scripttype= "Text/javascript"src= "Js/jquery-1.7.2.min.js"></Script></Head><Body> <Divstyle= "margin:20px auto; text-align:center;"> <Divstyle= "padding:50px;"> <inputtype= "button"ID= "Btnstart"value= "Start" /> </Div> <Divstyle= "BACKGROUND-COLOR:HSL (78%, 91%); width:500px; margin:20px Auto"> <labelID= "Labnumber"style= "font-size:80px; font-weight:bold;">Ten</label> </Div> <H2>Please Choose the correct answer:</H2> <H3>1:1+1=?</H3> <inputtype= "Radio"name= "Answer"value= "1" />1<inputtype= "Radio"name= "Answer"value= "2" />2<inputtype= "Radio"name= "Answer"value= "3" />3<inputtype= "Radio"name= "Answer"value= "4" />4<BR/> <inputtype= "button"ID= "Btnsubmit"value= "Submit" /> <Divstyle= "padding:50px;"> <inputtype= "button"ID= "Btnstop"value= "Stop" /> </Div> </Div> <Scripttype= "Text/javascript"> $('<audio id= "Ausound" ><source src= "Sound/wrong_answer_buzzer.mp3" type= "Audio/mpeg" ></audio> <audio id= "Aucorrect" ><source src= "Sound/correct_answer_bell_ring.mp3" type= "Audio/mpeg" ></audio >'). AppendTo ('Body'); varTimerid; $("#btnstart"). Live ("Click", function () { $("Input[name=answer]"). attr ("Disabled", false); Clearinterval (Timerid); var Number= Ten; var= $("#labNumber"); . Text (number); Timerid=SetInterval (function () { if( number> 0{. Text ('0' + (--Number )); } Else{clearinterval (Timerid); $('#auSound')[0].play (); $("Input[name=answer]"). attr ("Disabled", true); } }, +); }) $("#btnStop"). Live ("Click", function() {clearinterval (Timerid); }); $("#btnSubmit"). Live ("Click", function() {clearinterval (Timerid); if ($(": radio:checked"). Val ()== "2") { $('#auCorrect')[0].play (); Alert ("correct"); } Else { $('#auSound')[0].play (); Alert ("wrong"); } }); </Script></Body></HTML>
This is: (sound files will not be uploaded, you can own Baidu)
Timing Answer Demo
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
