javascript - 我无法在 JavaScript 中获取要打印到文本区域的属性值，出现错误 : Uncaught TypeError: Cannot read property 'value' of null

标签 javascript

我正在努力获取打印到在线考试申请文本区域的值。我是 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>
<小时/>

JavaScript 代码

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;
}

最佳答案

您提供了错误的文本区域名称:使用此:您的文本区域名称是 answersBox。并且您还需要关闭表单标记。您的 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 - 我无法在 JavaScript 中获取要打印到文本区域的属性值，出现错误 : Uncaught TypeError: Cannot read property 'value' of null，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27730462/

上一篇：javascript - Angular/javascript中的字符串参数

下一篇：javascript - AngularJS 通过源标签动态加载普通的旧 Javascript

相关文章：

javascript - setTimeout 与揭示模块模式

javascript - Angular:了解 DI 如何在动态加载的组件中工作

javascript - 如何合并实例中的模块？

javascript - 路由无法正常工作 AngularJS，只需添加哈希值

javascript - 值未保存到数组中

javascript - typescript 如何返回键类型

javascript - 如何显示来自 json 文件的标记列表？

javascript - 如何使用 Javascript 选择 html select 元素中的所有值

javascript - 如何创建一个 Sequelize 模型实例，而不将其保存在数据库中？

javascript - 在 react 中显示加载百分比

©2024 IT工具网  联系我们