为什么在定义了TypeType后会出现Uncaught TypeError?

时间:2019-07-07 10:26:49

标签: javascript html undefined typeerror

我正在做一个测验,这是html:

   <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>English Test</title>
    <link rel="stylesheet" href="testCss.css">
</head>

<body>
    <br>
    <div style="font-size:20px">
    <p>Please choose the correct answer and at the end tap the score button. </p>

<br>
<div>
    2. I
    <select id="question2">
        <option value="_">_</option>
        <option value="Am">am</option>
        <option value="Is">is</option>
        <option value="Are">are</option>
    </select>
    22 years old.
    <span id="question2_answer"></span>
</div>
<br>
<br>
<div>
    101. When can we meet again?
    <span id="question101_answer"></span>
    <div>
        <input type="radio" name="question101" > When are you free?<br>
        <input type="radio" name="question101" > It was two days ago. <br>
        <input type="radio" name="question101" > Can you help me?
    </div>
</div>
<br> 
<br>
<div>
    8. What is your father like?
    <span id="question8_answer"></span>
    <div>
        <input type="radio" name="question8" > He likes listenning to music.<br>
        <input type="radio" name="question8" > He likes to play football. <br>
        <input type="radio" name="question8" > He is friendly.<br>
        <input type="radio" name="question8" > He has a car.
    </div>
</div>
<br>

<br>


<button id="button1" class="button" onclick="viewScore()">Score Result</button>
<br>
<input type="text" id="grade1" value="" readonly>
<br>

<script src="testJs.js"></script>

这是我使用的testJs.js:

     var score = 0;

    function viewScore() {
        var answer2 = document.getElementById("question2").value;
        var answer8 = document.getElementsByName("question8");
        var answer101 = document.getElementsByName("question101").value;


        if (answer2 == "Am") {
            document.getElementById("question2_answer").style.color = "green";
            document.getElementById("question2_answer").innerHTML = "&#10004";
            score += 1;
        } else {
            document.getElementById("question2_answer").style.color = "red";
            document.getElementById("question2_answer").innerHTML = "&#10006 Wrong!";
        }

        if (answer8[2].checked) {
            document.getElementById("question8_answer").style.color = "green";
            document.getElementById("question8_answer").innerHTML = "&#10004";
            score += 1;
        } else {
            document.getElementById("question8_answer").style.color = "red";
            document.getElementById("question8_answer").innerHTML = "&#10006 Wrong!";
        }
        if (answer101[0].checked) {
            document.

getElementsById("question101_answer").style.color = "green";
        document.getElementsById("question101_answer").innerHTML = "&#10004";
        score += 1;
    } else {
        document.getElementsByID("question101_answer").style.color = "red";
        document.getElementsByID("question101_answer").innerHTML = "&#10006 Wrong!";
    }


    if (score<=5) {
        document.getElementById("grade1").value = " Your total score is: "+ score+"    Your level is: "+"Elementary.";

    } else if(score<=8){
        document.getElementById("grade1").value = " Your total score is: "+ score+"    Your level is: "+"Pre Intermediate.";

    }else if(score<=15){
        document.getElementById("grade1").value = " Your total score is: "+ score+"    Your level is: "+"Intermediate.";

    }else{
        document.getElementById("grade1").value = " Your total score is: "+ score+"    Your level is: "+"Upper Intermediate.";

    }
    console.log(score);
    score = 0;
}

但是,我在问题101上遇到以下错误。我对其进行了多次检查,但我不知道此错误是从哪里来的!它引用了问题101,并提到无法读取未定义的属性“ 0”。 感谢您的任何提前帮助。

  

testJs.js:26未捕获的TypeError:无法读取未定义的属性“ 0”       在viewScore(testJs.js:26)       在HTMLButtonElement.onclick(testHTML.html:57)

2 个答案:

答案 0 :(得分:1)

发生这种情况是因为在这一行:

var answer101 = document.getElementsByName("question101").value;

您要放置输入的(为NULL或未定义,因为HTMLCollection返回的getElementsByName(请注意复数)没有value属性)放入var answer101中,而不是输入本身。

要解决此问题,请将上面的行更改为:

var answer101 = document.getElementsByName("question101");

答案 1 :(得分:1)

您必须为var answer101选择数组(不是值)

   var converter = new NReco.VideoConverter.FFMpegConverter();
            converter.ConvertMedia(FilePath, FilePath, NReco.VideoConverter.Format.h264);

并更正答案101的内容

var answer101 = document.getElementsByName("question101");