The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> test questions with graphics, individual test questions with graphics only for that question
ij1962
post Dec 12 2014, 09:22 AM
Post #1





Group: Members
Posts: 1
Joined: 12-December 14
Member No.: 21,932



Hi,
I am new to this area so any help would be greatly appreciated. I am writing a test paper for students and would like to introduce graphics for each individual question, so when the question is answered the next question is brought up onto the screen.

The code is as below:

<!DOCTYPE html> <html> <head> <meta charset="UTF-8">
<h1><b><FONT COLOR="#0000FF">Exam No. Three Re-establishing Gas Supplies</FONT></b></h1>
<style> div#test{ border:#000 1px solid; padding:10px 40px 40px 40px; }
</style>
<script>
var pos = 0, test, test_status, question, choice, choices, chA, chB, chC, chD, correct = 0;
var questions = [
[ "When it comes to the gas combustion requirements of a domestic natural gas appliance we are w anting to establish 2 things. They Are:", "The gas appliance is getting the correct amount of gas at the correct pressure.", "The gas appliance is getting the correct amount of gas", "The gas appliance is getting the correct amount of air.", "The gas appliance is getting the correct pressure", "A" ],
[ "How do we determine the resistance of the pipework and any tees or bends relative to pipework sizing?", "By calculating its diameter.", "By calculating its gerneral size.", "By calculating its equivalent length.", "Making a guess at its size.", "C" ],
[ "If we carried out a Gas Inlet G20 Operating Pressure test at a new gas appliance just installed as part of the commission with a result of 19mb, what is the maximum Operating Pressure (Working Pressure) we should expect to find at the meter??", "19mbar", "20mbar", "23mbar", "21mbar.", "D" ],
[ "Before installing new pipework to an installation, you carry out a gas operating pressure test (Working Pressure) at the meter. Your U-Gauge (Manometer) reads 21mb. When you have finished your pipwork design what is the intended pressure you are designing at the appliance inlet, and what should you find under test?", "19mabr", "23mbar", "21mabr", "20mbar", "D" ],
[ "Who you ask ?", "a", "b", "c", "d", "C" ],
];
function _(x){
return document.getElementById(x);
}
function renderQuestion(){
test = _("test");
if(pos >= questions.length){
test.innerHTML = "<h2>You got "+correct+" out of "+questions.length+" questions correct</h2>";
_("test_status").innerHTML = "Test Completed";
pos = 0;
correct = 0;
return false;
}
_("test_status").innerHTML = "Question "+(pos+1)+" of "+questions.length; question = questions[pos][0];
chA = questions[pos][1];
chB = questions[pos][2];
chC = questions[pos][3];
chD = questions[pos][4];
test.innerHTML = "<h3>"+question+"</h3>";
test.innerHTML += "<input type='radio' name='choices' value='A'> "+chA+"<br>";
test.innerHTML += "<input type='radio' name='choices' value='B'> "+chB+"<br>";
test.innerHTML += "<input type='radio' name='choices' value='C'> "+chC+"<br>";
test.innerHTML += "<input type='radio' name='choices' value='D'> "+chD+"<br><br>";
test.innerHTML += "<button onclick='checkAnswer()'>Submit Answer</button>";
}
function checkAnswer(){ choices = document.getElementsByName("choices");
for(var i=0; i<choices.length; i++){
if(choices[i].checked){
choice = choices[i].value;
}
}
if(choice == questions[pos][5]){
correct++;
}
pos++;
renderQuestion();
}
window.addEventListener("load", renderQuestion, false);
</script>
</head> <body>
<h2 id="test_status"></h2>
<div id="test"></div>
</body> </html>


Cheers for any help you can offer
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic


Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 26th April 2024 - 07:48 PM