Почему я получаю Uncaught TypeError, пока я его определил? - PullRequest
0 голосов
/ 07 июля 2019

Я пытаюсь сделать тест, вот 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 Uncaught TypeError: Невозможно прочитать свойство '0' из неопределенного на viewScore (testJs.js: 26) в HTMLButtonElement.onclick (testHTML.html: 57)

Ответы [ 2 ]

1 голос
/ 07 июля 2019

Вы должны выбрать массив (не значение) для var answer101

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

И исправить, если содержание для ответа101

if (answer101[0].checked) {
            document.getElementById("question101_answer").style.color = "green";
            document.getElementById("question101_answer").innerHTML = "&#10004";
            score += 1;
        } else {
            document.getElementById("question101_answer").style.color = "red";
            document.getElementById("question101_answer").innerHTML = "&#10006 Wrong!";
        }
1 голос
/ 07 июля 2019

Это происходит потому, что в этой строке:

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

вы вводите значение ввода (которое равно NULL или UNDEFINED, потому что HTMLCollection возвращается getElementsByName (обратите внимание на множественное число) не имеет свойства value) в var answer101, а НЕ на сам вход.

Чтобы исправить это, измените приведенную выше строку на:

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

...