document.getElementById on an input element returning undefined
I am creating a quid of quizz splitted on mulitple pages and I try to pass the score of each question to the next page using the get method with javascript.
I use a function called gValue() to get the variables from the previous page (called "s" + the number of the page) in the url, and then I want to add this variable (that I call 'score') to the values of the 3 multiple choices answers on the following page and replicate the whole process over and over.
I have a problem with inserting the newscore into the values of each of the radio input fields.
I don't get any console error nor javascript error but I get "undefined" when I want to check if the new values are added the right way to each input element in the form.
Here is the code of my first page and then of the second page, where I want to see the new values inserted into the form:
First page sending the s1 variable:
<!DOCTYPE html PUBLIC "-//开发者_运维知识库W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="style.css" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="robots" content="index, follow" />
<meta name="googlebot" content="index, follow" />
</head>
<body>
<div>Choose between<br />
<form name="fo" method="get" action="part1.html">
<input type="radio" name="s1" value="1" />one<br />
<input type="radio" name="s1" value="2" />two<br />
<input type="radio" name="s1" value="3" />three<br />
<input type="submit" value="continuer" />
</form>
</div>
</body>
</html>
second page, where I want to extract the value of s1 and add it to the values of the 3 inputs in the form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="style.css" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="robots" content="index, follow" />
<meta name="googlebot" content="index, follow" />
<script type="text/javascript">
<!--
function subnewsc() {
for (i = 1; i <= 3; i++) {
var score = gValue();
score = parseInt(score);
i = parseInt(i);
var newscore = score + i;
var doc = 'document.getElementById("a' + i + '")';
doc.value = newscore;
}
}
function gValue() {
var url = window.location.href;
var qparts = url.split("?");
if (qparts.length == 0) {
return "";
}
var query = qparts[1];
var vars = query.split("&");
var value = "";
for (var i = 0; i < vars.length; i++) {
var parts = vars[i].split("=");
for (var f = 1; f <= 3; f++) {
var ss = "s" + f;
if (parts[0] == ss) {
value = parts[1];
break;
}
}
}
return value;
}
// -->
</script>
</head>
<body>
<div>choose between<br />
<form name="fo" method="get" action="part2.html">
<input id="a1" type="radio" name="s2" value="1" />one again<br />
<input id="a2" type="radio" name="s2" value="2" />two again<br />
<input id="a3" type="radio" name="s2" value="3" />three again<br />
<input type="submit" value="continuer" />
</form>
<script type="text/javascript">
<!--
var boby = subnewsc();
document.write(boby);
//-->
</script>
</div>
</body>
</html>
I don't know why I am getting undefined when I check using the "boby" variable. I first thought that it was because of the DOM, that the function subnewsc() was called too early so that the elements weren't yet there but it shouldn't be the case as I am now calling it later.
It also doesn't seem to have to do with the nature of the id name in the document.getElementById as it should be a string (a string plus a number becoming a string)
maybe
var doc = document.getElementById("a'+ i +'");
without single quotes
javascript can be a little funky - mere spaces in code can cause this error, here is an example of what i expierienced, here is a script I wrote:
<select id="mySelect" multiple="multiple"> <option>Apple</option>
when I ran this javascript and tried to find the firstchild, got error message stating "undefined" However, I removed the space from the following line and that fixed it:
<select id="mySelect" multiple="multiple"><option>Apple</option>
please notice how I removed the space between multiple and option
加载中,请稍侯......
精彩评论