I can't get the property value to print to textarea in JavaScript, I get an error: Uncaught TypeError: Cannot read property 'value' of null
I can't get the property value to print to textarea in JavaScript, I get an error: Uncaught TypeError: Cannot read property 'value' of null
我正在努力获取打印到我的在线考试申请的文本区域的值。我是 JavaScript 的新手，但学得很快。我欢迎任何帮助，因为它让我疯狂地尝试各种不同的方式但没有成功。
提前致谢。
HTML代码：
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>testexam</title>
<link rel="stylesheet" href="tutor.css" media="all" type="text/css">
<!-- Custom Fonts -->
<link href="font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- JS code from stack overflow; modified to suit application by Paul Gillis.-->
<script type="text/javascript"></script>
</head>
<body>
<div class= "container">
<div class="col-sm-4">
<img class="img- img-responsive img-center" src="img/EXAM.PNG" alt="">
</div>
</div>
<h1>Exam Level 1</h1>
<form name ="testexam">
<ol>
<div><img class="img- img-responsive img-center" src="examimg/A1sharp.png" alt=""></div>
<li>Question 1, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q1" value = "wrong" >This note is B</input></li>
<li><input type = "radio" name ="q1" value = "correct" >This note is A#</input></li>
<li><input type = "radio" name ="q1" value = "wrong" >This note is C</input></li>
</ul>
<hr>
<div><img class="img- img-responsive img-center" src="examimg/A1.png" alt=""></div>
<li> Question 2, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q2" value = "correct">This note is A</input></li>
<li><input type = "radio" name ="q2" value = "wrong">This note is B</input></li>
<li><input type = "radio" name ="q2" value = "wrong">This note is C</input></li>
</ul>
<hr>
<div><img class="img- img-responsive img-center" src="examimg/B1.png" alt=""></div>
<li> Question 3, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q3" value = "wrong">This note is D</input></li>
<li><input type = "radio" name ="q3" value = "correct">This note is B</input></li>
<li><input type = "radio" name ="q3" value = "wrong">This note is A</input></li>
</ul>
<hr>
<input type ="button" value = "hello" onclick="sayhello()"></input>
<input type ="button" value = "submit" onclick ="checkAll()"></input>
<input type ="reset" value = "clear"></input>
<textarea rows ="6" cols = "60" name ="answersBox">Your Answer Results are Listed Below</textarea>
</body>
<footer>
<script type="text/javascript" src="js/testexam.js"></script>
</footer>
</html>
Javacript 代码
function sayhello()
{
alert("hello");
}
var text2display = "";
var answers = new Array(3);
answers[0] = "1.This note is A#\n";
answers[1] = "2.This note is A\n";
answers[2] = "3.This note is B\n";
var questions = new Array(3);
questions[0] = "q1";
questions[1] = "q2";
questions[2] = "q3";
function checkQs(s)
{
var qs = document.getElementsByName(s);
var noOfRadios = qs.length;
for(var i = 0; i < noOfRadios; i++)
{
if(qs[i].checked)
{
if (qs[i].value == "correct")
text2display = text2display + "Well Done You are Correct";
else text2diaplay = text2display + answers[questions.indexOf(s)];
break;
}
}
}
function checkAll()
{
for(var i = 0; i < questions.length; i++)
{
checkQs(questions[i]);
}
testexam.answerBox.value = text2display;
}
你给错了文本区 name:use this:you 文本区名称是 answersBox。并且你需要关闭你的表单标签 also.your HTML 没有很好地组织尝试遵循一些教程。
testexam.answersBox.value = text2display;
function sayhello()
{
alert("hello");
}
var text2display = "";
var answers = new Array(3);
answers[0] = "1.This note is A#\n";
answers[1] = "2.This note is A\n";
answers[2] = "3.This note is B\n";
var questions = new Array(3);
questions[0] = "q1";
questions[1] = "q2";
questions[2] = "q3";
function checkQs(s)
{
var qs = document.getElementsByName(s);
var noOfRadios = qs.length;
for(var i = 0; i < noOfRadios; i++)
{
if(qs[i].checked)
{
if (qs[i].value == "correct")
text2display = text2display + "Well Done You are Correct";
else text2diaplay = text2display + answers[questions.indexOf(s)];
break;
}
}
}
function checkAll()
{
for(var i = 0; i < questions.length; i++)
{
checkQs(questions[i]);
}
testexam.answersBox.value = text2display;
}
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>testexam</title>
<link rel="stylesheet" href="tutor.css" media="all" type="text/css">
<!-- Custom Fonts -->
<link href="font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- JS code from stack overflow; modified to suit application by Paul Gillis.-->
<script type="text/javascript"></script>
</head>
<body>
<div class= "container">
<div class="col-sm-4">
<img class="img- img-responsive img-center" src="img/EXAM.PNG" alt="">
</div>
</div>
<h1>Exam Level 1</h1>
<form name ="testexam">
<ol>
<div><img class="img- img-responsive img-center" src="examimg/A1sharp.png" alt=""></div>
<li>Question 1, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q1" value = "wrong" >This note is B</input></li>
<li><input type = "radio" name ="q1" value = "correct" >This note is A#</input></li>
<li><input type = "radio" name ="q1" value = "wrong" >This note is C</input></li>
</ul>
<div><img class="img- img-responsive img-center" src="examimg/A1.png" alt=""></div>
<li> Question 2, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q2" value = "correct">This note is A</input></li>
<li><input type = "radio" name ="q2" value = "wrong">This note is B</input></li>
<li><input type = "radio" name ="q2" value = "wrong">This note is C</input></li>
</ul>
<div><img class="img- img-responsive img-center" src="examimg/B1.png" alt=""></div>
<li> Question 3, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q3" value = "wrong">This note is D</input></li>
<li><input type = "radio" name ="q3" value = "correct">This note is B</input></li>
<li><input type = "radio" name ="q3" value = "wrong">This note is A</input></li>
</ul>
</ol>
<input type ="button" value = "hello" onclick="sayhello()"></input>
<input type ="button" value = "submit" onclick ="checkAll()"></input>
<input type ="reset" value = "clear"></input>
<textarea rows ="6" cols = "60" name ="answersBox">Your Answer Results are Listed Below</textarea>
</form>
</body>
<footer>
<script type="text/javascript">
</script>
</footer>
</html>
我正在努力获取打印到我的在线考试申请的文本区域的值。我是 JavaScript 的新手，但学得很快。我欢迎任何帮助，因为它让我疯狂地尝试各种不同的方式但没有成功。 提前致谢。
HTML代码：
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>testexam</title>
<link rel="stylesheet" href="tutor.css" media="all" type="text/css">
<!-- Custom Fonts -->
<link href="font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- JS code from stack overflow; modified to suit application by Paul Gillis.-->
<script type="text/javascript"></script>
</head>
<body>
<div class= "container">
<div class="col-sm-4">
<img class="img- img-responsive img-center" src="img/EXAM.PNG" alt="">
</div>
</div>
<h1>Exam Level 1</h1>
<form name ="testexam">
<ol>
<div><img class="img- img-responsive img-center" src="examimg/A1sharp.png" alt=""></div>
<li>Question 1, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q1" value = "wrong" >This note is B</input></li>
<li><input type = "radio" name ="q1" value = "correct" >This note is A#</input></li>
<li><input type = "radio" name ="q1" value = "wrong" >This note is C</input></li>
</ul>
<hr>
<div><img class="img- img-responsive img-center" src="examimg/A1.png" alt=""></div>
<li> Question 2, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q2" value = "correct">This note is A</input></li>
<li><input type = "radio" name ="q2" value = "wrong">This note is B</input></li>
<li><input type = "radio" name ="q2" value = "wrong">This note is C</input></li>
</ul>
<hr>
<div><img class="img- img-responsive img-center" src="examimg/B1.png" alt=""></div>
<li> Question 3, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q3" value = "wrong">This note is D</input></li>
<li><input type = "radio" name ="q3" value = "correct">This note is B</input></li>
<li><input type = "radio" name ="q3" value = "wrong">This note is A</input></li>
</ul>
<hr>
<input type ="button" value = "hello" onclick="sayhello()"></input>
<input type ="button" value = "submit" onclick ="checkAll()"></input>
<input type ="reset" value = "clear"></input>
<textarea rows ="6" cols = "60" name ="answersBox">Your Answer Results are Listed Below</textarea>
</body>
<footer>
<script type="text/javascript" src="js/testexam.js"></script>
</footer>
</html>
Javacript 代码
function sayhello()
{
alert("hello");
}
var text2display = "";
var answers = new Array(3);
answers[0] = "1.This note is A#\n";
answers[1] = "2.This note is A\n";
answers[2] = "3.This note is B\n";
var questions = new Array(3);
questions[0] = "q1";
questions[1] = "q2";
questions[2] = "q3";
function checkQs(s)
{
var qs = document.getElementsByName(s);
var noOfRadios = qs.length;
for(var i = 0; i < noOfRadios; i++)
{
if(qs[i].checked)
{
if (qs[i].value == "correct")
text2display = text2display + "Well Done You are Correct";
else text2diaplay = text2display + answers[questions.indexOf(s)];
break;
}
}
}
function checkAll()
{
for(var i = 0; i < questions.length; i++)
{
checkQs(questions[i]);
}
testexam.answerBox.value = text2display;
}
你给错了文本区 name:use this:you 文本区名称是 answersBox。并且你需要关闭你的表单标签 also.your HTML 没有很好地组织尝试遵循一些教程。
testexam.answersBox.value = text2display;
function sayhello()
{
alert("hello");
}
var text2display = "";
var answers = new Array(3);
answers[0] = "1.This note is A#\n";
answers[1] = "2.This note is A\n";
answers[2] = "3.This note is B\n";
var questions = new Array(3);
questions[0] = "q1";
questions[1] = "q2";
questions[2] = "q3";
function checkQs(s)
{
var qs = document.getElementsByName(s);
var noOfRadios = qs.length;
for(var i = 0; i < noOfRadios; i++)
{
if(qs[i].checked)
{
if (qs[i].value == "correct")
text2display = text2display + "Well Done You are Correct";
else text2diaplay = text2display + answers[questions.indexOf(s)];
break;
}
}
}
function checkAll()
{
for(var i = 0; i < questions.length; i++)
{
checkQs(questions[i]);
}
testexam.answersBox.value = text2display;
}
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>testexam</title>
<link rel="stylesheet" href="tutor.css" media="all" type="text/css">
<!-- Custom Fonts -->
<link href="font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- JS code from stack overflow; modified to suit application by Paul Gillis.-->
<script type="text/javascript"></script>
</head>
<body>
<div class= "container">
<div class="col-sm-4">
<img class="img- img-responsive img-center" src="img/EXAM.PNG" alt="">
</div>
</div>
<h1>Exam Level 1</h1>
<form name ="testexam">
<ol>
<div><img class="img- img-responsive img-center" src="examimg/A1sharp.png" alt=""></div>
<li>Question 1, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q1" value = "wrong" >This note is B</input></li>
<li><input type = "radio" name ="q1" value = "correct" >This note is A#</input></li>
<li><input type = "radio" name ="q1" value = "wrong" >This note is C</input></li>
</ul>
<div><img class="img- img-responsive img-center" src="examimg/A1.png" alt=""></div>
<li> Question 2, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q2" value = "correct">This note is A</input></li>
<li><input type = "radio" name ="q2" value = "wrong">This note is B</input></li>
<li><input type = "radio" name ="q2" value = "wrong">This note is C</input></li>
</ul>
<div><img class="img- img-responsive img-center" src="examimg/B1.png" alt=""></div>
<li> Question 3, which is the correct answer</li>
<ul>
<li><input type = "radio" name ="q3" value = "wrong">This note is D</input></li>
<li><input type = "radio" name ="q3" value = "correct">This note is B</input></li>
<li><input type = "radio" name ="q3" value = "wrong">This note is A</input></li>
</ul>
</ol>
<input type ="button" value = "hello" onclick="sayhello()"></input>
<input type ="button" value = "submit" onclick ="checkAll()"></input>
<input type ="reset" value = "clear"></input>
<textarea rows ="6" cols = "60" name ="answersBox">Your Answer Results are Listed Below</textarea>
</form>
</body>
<footer>
<script type="text/javascript">
</script>
</footer>
</html>