Question

我无法弄清楚这里发生了什么。这是我用单选按钮编写的一个小测验。这是我第一次玩表格和javascript。我不明白为什么得分总是1.问题是在提交时，它只会更新到第二个答案的+得分。当我删除2nd +得分时，该值仍为0，当我将第二回答的+得分更改为10时，得分为10.真的很感激帮助。

Javascript代码：

function validateRadio(obj, correct) {

                var result = 0;
                var i;
                var l = obj.lenght;

                for (i = 0; i < l; i++) {

                    if(obj[i].checked == true && obj[i].value == correct) {

                        result = 1;

                    }

                }

                if (!result && obj[i].value == correct) {

                    result = 1;

                }

                return result;

            }           


        function validateSubmit(obj) {

            //configuration             
            var score = 0;

            //cache DOM                 
            var scoreMsg = document.getElementById('scoreMsg');

            //Score update on correct asnwer

            if (validateRadio(obj.radAns1, 2)) {

                score += 1;

            }

            if (validateRadio(obj.radAns2, 1)) {

                score += 1;

            }

            if (validateRadio(obj.radAns3, 3)) {

                score += 1;

            }

            if (validateRadio(obj.radAns4, 5)) {

                score += 1;

            }

            if (validateRadio(obj.radAns5, 4)) {

                score += 1;

            }

            scoreMsg.innerHTML = score;

}

HTML code;

   <form onsubmit="validateSubmit(this);return false;" action='#'>

                <div id="pytanie 1" class="pytania">

                    <span class="pytanie-numer">Pytanie 1</span> <br><br>

                    <span class="pytanie">Do ktorej klasy chodzi lama?</span>

                    <input type="radio" name="radAns1" value="1" checked>Liceum
                    <input type="radio" name="radAns1" value="2">Gimbazjum
                    <input type="radio" name="radAns1" value="3">Podstawowka
                    <input type="radio" name="radAns1" value="4">Zawodowka
                    <input type="radio" name="radAns1" value="5">Technikum

                </div><br><br>

                <div id="pytanie 2" class="pytania">

                    <span class="pytanie-numer">Pytanie 2</span> <br><br>

                    <span class="pytanie">Jakiego radia slucha lama?</span>

                    <input type="radio" name="radAns2" value="1" checked>Radio Maryja
                    <input type="radio" name="radAns2" value="2">Radio Gold
                    <input type="radio" name="radAns2" value="3">Radio Kaszebe
                    <input type="radio" name="radAns2" value="4">Eska-Tv
                    <input type="radio" name="radAns2" value="5">Radio Z/Radio RMF-FM

                </div><br><br>

                <div id="pytanie 3" class="pytania">

                    <span class="pytanie-numer">Pytanie 3</span> <br><br>

                    <span class="pytanie">Z czego sklada sie dieta lamy?</span>

                    <input type="radio" name="radAns3" value="1" checked>Z marchwi
                    <input type="radio" name="radAns3" value="2">Z jablka
                    <input type="radio" name="radAns3" value="3">Z galazek
                    <input type="radio" name="radAns3" value="4">Z grzybow
                    <input type="radio" name="radAns3" value="5">Z siana

                </div><br><br>

                <div id="pytanie 4" class="pytania">

                    <span class="pytanie-numer">Pytanie 4</span> <br><br>

                    <span class="pytanie">Okresl skilla w CS'a lamy.</span>

                    <input type="radio" name="radAns4" value="1" checked>Noob
                    <input type="radio" name="radAns4" value="2">Silver
                    <input type="radio" name="radAns4" value="3">Lama
                    <input type="radio" name="radAns4" value="4">Ciota
                    <input type="radio" name="radAns4" value="5">Wszystkie odpowiedzi

                </div><br><br>

                <div id="pytanie 5" class="pytania">

                    <span class="pytanie-numer">Pytanie 5</span> <br><br>

                    <span class="pytanie">Czy lama jedzie autem/rowerem?</span>

                    <input type="radio" name="radAns5" value="1" checked>Nie bo, nie umie jezdzic
                    <input type="radio" name="radAns5" value="2">Nie, bo jest za glupi
                    <input type="radio" name="radAns5" value="3">Nie bo, ma kopyta
                    <input type="radio" name="radAns5" value="4">Nie bo, zostal skocony
                    <input type="radio" name="radAns5" value="5">Nie bo, jest debilem i wszyskie odpowiedzi powyzej

                </div><br><br>

                <input type="submit" value="Wyslij odpowiedzi"> 

            </form>

Answer 1

也许'validateRadio'函数中的Javascript代码可以更容易：

// html

<form onsubmit="validateSubmit(this);return false;" action='#'>
    <div id="pytanie 1" class="pytania">
        <span class="pytanie-numer">Pytanie 1</span> <br><br>
        <span class="pytanie">Do ktorej klasy chodzi lama?</span>
        <input type="radio" name="radAns1" value="1" checked>Liceum
        <input type="radio" name="radAns1" value="2">Gimbazjum
        <input type="radio" name="radAns1" value="3">Podstawowka
        <input type="radio" name="radAns1" value="4">Zawodowka
        <input type="radio" name="radAns1" value="5">Technikum
    </div><br><br>
    <div id="pytanie 2" class="pytania">
        <span class="pytanie-numer">Pytanie 2</span> <br><br>
        <span class="pytanie">Jakiego radia slucha lama?</span>
        <input type="radio" name="radAns2" value="1" checked>Radio Maryja
        <input type="radio" name="radAns2" value="2">Radio Gold
        <input type="radio" name="radAns2" value="3">Radio Kaszebe
        <input type="radio" name="radAns2" value="4">Eska-Tv
        <input type="radio" name="radAns2" value="5">Radio Z/Radio RMF-FM
    </div><br><br>
    <div id="pytanie 3" class="pytania">
        <span class="pytanie-numer">Pytanie 3</span> <br><br>
        <span class="pytanie">Z czego sklada sie dieta lamy?</span>
        <input type="radio" name="radAns3" value="1" checked>Z marchwi
        <input type="radio" name="radAns3" value="2">Z jablka
        <input type="radio" name="radAns3" value="3">Z galazek
        <input type="radio" name="radAns3" value="4">Z grzybow
        <input type="radio" name="radAns3" value="5">Z siana
    </div><br><br>
    <div id="pytanie 4" class="pytania">
        <span class="pytanie-numer">Pytanie 4</span> <br><br>
        <span class="pytanie">Okresl skilla w CS'a lamy.</span>
        <input type="radio" name="radAns4" value="1" checked>Noob
        <input type="radio" name="radAns4" value="2">Silver
        <input type="radio" name="radAns4" value="3">Lama
        <input type="radio" name="radAns4" value="4">Ciota
        <input type="radio" name="radAns4" value="5">Wszystkie odpowiedzi
    </div><br><br>
    <div id="pytanie 5" class="pytania">
        <span class="pytanie-numer">Pytanie 5</span> <br><br>
        <span class="pytanie">Czy lama jedzie autem/rowerem?</span>
        <input type="radio" name="radAns5" value="1" checked>Nie bo, nie umie jezdzic
        <input type="radio" name="radAns5" value="2">Nie, bo jest za glupi
        <input type="radio" name="radAns5" value="3">Nie bo, ma kopyta
        <input type="radio" name="radAns5" value="4">Nie bo, zostal skocony
        <input type="radio" name="radAns5" value="5">Nie bo, jest debilem i wszyskie odpowiedzi powyzej
    </div><br><br>
    <input type="submit" value="Wyslij odpowiedzi">
</form>
<div id="scoreMsg"></div>

// Javascript

function validateRadio(obj, correct) {
    return obj.value == correct;
}

function validateSubmit(obj) {
    var score = 0;
    var scoreMsg = document.getElementById('scoreMsg');

    if (validateRadio(obj.radAns1, 2)) {
        score += 1;
    }

    if (validateRadio(obj.radAns2, 1)) {
        score += 1;
    }

    if (validateRadio(obj.radAns3, 3)) {
        score += 1;
    }

    if (validateRadio(obj.radAns4, 5)) {
        score += 1;
    }

    if (validateRadio(obj.radAns5, 4)) {
        score += 1;
    }
    scoreMsg.innerHTML = score;
}

Javascript表单分数更新提交

1 个答案: