javascript quiz help needed
so basicaly my problem is that i need the submit button to pop-up a new window, containing the score and the right answers. Heres what i tried to do, which doesnt work: (body code):
<form id="textcont" name="htmltest" onSubmit="return checkAll() && results()">
<b>1) Τι σημαίνει HTML?</b><br>
<input type="radio" name="q1" value="a" onclick="score[1]=0">a) Home Tool Markup Language<br>
<input type="radio" name="q1" value="b" onclick="score[1]=0">b) Hyperlinks and Text Markup Language<br>
<input type="radio" name="q1" value="c" onclick="score[1]=1">c) Hyper Text Markup Language<br>
<b>2) Διάλεξε το σωστό HTML tag για την μεγαλύτερη επικεφαλίδα:</b><br>
<input type="radio" name="q2" value="a" onclick="score[2]=0">a) < h6 ><br>
<input type="radio" name="q2" value="b" onclick="score[2]=0">b) < head ><br>
<input type="radio" name="q2" value="c" onclick="score[2]=1">c) < h1 ><br>
<b>3) Ποιο είναι τ开发者_如何学Cο σωστό HTML tag για line break?</b><br>
<input type="radio" name="q3" value="a" onclick="score[3]=0">a) < break ><br>
<input type="radio" name="q3" value="b" onclick="score[3]=0">b) < lb ><br>
<input type="radio" name="q3" value="c" onclick="score[3]=1">c) < br ><br>
<b>4) Διάλεξε το σωστό HTML tag για να κάνεις bold κάποια γράμματα:</b><br>
<input type="radio" name="q4" value="a" onclick="score[4]=0">a) < bold ><br>
<input type="radio" name="q4" value="b" onclick="score[4]=1">b) < b ><br>
<input type="radio" name="q4" value="c" onclick="score[4]=0">c) < text.bold ><br>
<b>5) Ποιος είναι ο σωστός τρόπος για να δημιουργήσετε έναν υπερσύνδεσμο;</b><br>
<input type="radio" name="q5" value="a" onclick="score[5]=0">a) < a url="http://www.unipi.gr">Unipi.gr < / a><br>
<input type="radio" name="q5" value="b" onclick="score[5]=1">b) < a href="http://www.unipi.gr">Unipi.gr< / a><br>
<input type="radio" name="q5" value="c" onclick="score[5]=0">c) < a >http://www.unipi.gr"< / a><br>
<b>6) Ποια απο τα παρακάτω HTML tag απευθύνονται όλα σε πίνακα?</b><br>
<input type="radio" name="q6" value="a" onclick="score[6]=0">a) < table >, < head >, < tfoot ><br>
<input type="radio" name="q6" value="b" onclick="score[6]=0">b) < table >, < tr >, < tt ><br>
<input type="radio" name="q6" value="c" onclick="score[6]=1">c) < table >, < tr> , < td ><br>
<input type="submit" value="Αξιολόγηση"> <input type="reset" value="Reset"><br><br>
</form>
javascript file:
function checkAll()
{
var oops = "";
for ( var q = 1; q <= 6; ++q )
{
var rbs = document.htmltest["q" + q];
var okay = false;
for ( var r = 0; r < rbs.length; ++r )
{
if ( rbs[r].checked ) okay = true;
}
if ( ! okay ) oops += "," + q;
}
if ( oops != "" )
{
alert("Δεν απαντήσατε στις εξής ερωτήσεις: " + oops.substring(1) +"\n Παρακαλώ απαντήστε σε όλες τις ερωτήσεις.");
return false;
}
return true;
}
var score = new Array;
function results()
{
var i, total;
total = 0;
for(i=1;i<=6;i++)
{
total += score[i];
}
window=window.open("resultshtml.html","answers","width=400px,height=700px");
}
and resultshtml.html file:
<html>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-7">
<head>
<title>html test results</title>
</head>
<link rel="stylesheet" type="text/css" href="stylesheet.css"/>
<body>
<script type="text/javascript">
var total = window.opener.total;
document.write(total);
</script>
</body>
</html>
unfortunately, document.write in the last window returns "undefined"
You have at least two problems that I see:
- You must define
totalin the global scope sowindow.openercan access it. - Since the form is being submitted, the page is reloaded and
score,totaland all other variables will return to their initial state. So you have to stop the form submition:return falseon functionresults.
Notes:
The way you modify score from the radio inputs is not good. You better use the value attribute to convey information:
<input type="radio" name="q2" value="c" onclick="score[2]=1">...
vs
<input type="radio" name="q2" value="2,1">...
# iterate over selected inputs
var pair = selected_input.value.split(",")
var key = pair[0], value = pair[1];
score[key] = value;
And you better define score as an object and iterate over it with (for key in score) { score[key] ... }
But anyway, why don't you run your JS code in the parent page?
new_window = window.open("resultshtml.html","answers","width=400px,height=700px");
new_window.document.write(total);
If you prefer this code to be in the popup window, then create a function there and call it from the parent with the required info (score in this case). In any of these cases you won't depend whether the parent page is reloaded or not.
function results()
{
var i, total;
This declares total as a local variable, which cannot be accessed from the other window. You can fix that (making it a global variable) by removing that part from the var statement (and optionally putting a new var statement for the variable outside of any functions).
As a side note, you should use the < and > escape codes for the less/greater than signs within the form. That would eliminate the need to insert spaces and make it more valid HTML.
Try removing total from the var i, total; declaration? I think it creates a local scoped variable this way.
加载中,请稍侯......
精彩评论