Javascript string comparison

Question

So, im trying to create interactive quiz and im almost done. Only the answer checking part fails miserably. I have arrays for questions, options and the right answer, but the comparison just keeps failing.

function check(clicked_id)
{
    document.getElementById("Question").value=" " + questionArray[i];
    document.getElementById("OptionA").value=" " + aArray[i]; 
    document.getElementById("OptionB").value=" " + bArray[i]; 
    document.getElementById("OptionC").value=" " + cArray[i]; 
    document.getElementById("OptionD").value=" " + dArray[i]; 

    var selected = document.getElementById(clicked_id).value;
    var answer = answerArray[i];

    document.getElementById("text").innerHTML = answer + "<br>" + selected;

    if (selected == answer) {
        document.getElementById("comparison").innerHTML = "Correct";
    } else {
        document.getElementById("comparison").innerHTML = "Wrong";
    }   
}

And the html part is

<input onclick="check(this.id)" type="button" value="Click here to start" id="Question" /><br><br>
<input onclick="check(this.id)" type="button" value="" id="OptionA" />
<input onclick="check(this.id)" type="button" value="" id="OptionB" />
<input onclick="check(this.id)" type="button" value="" id="OptionC" />
<input onclick="check(this.id)" type="button" value="" id="OptionD" />
<div id="text"></div>
<div id="comparison"></div>

For what ever reason it just wont work and i dont understand why.

Attach a breakpoint and see if your selected and answer variables have the values you expected. Without seeing more of your code, we're just guessing. Can you put it in a fiddle? — Matt Burland
– Matt Burland, Commented Apr 21, 2014 at 14:09
If your test is going like showing a div for a question and after answered hide it and show another, this code will fail if you use same id for all options in each seperate divs. — Batu.Khan
– Batu.Khan, Commented Apr 21, 2014 at 14:12

DaveK · Accepted Answer · 2014-04-21 14:12:42Z

1

You seem to be adding whitespace to the front of the value but you never remove the whitespace before you compare. At least I can't see if you do. Try this.

var selected = document.getElementById(clicked_id).value.trim();

answered Apr 21, 2014 at 14:12

DaveK

5901 gold badge7 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Amit Prajapati · Accepted Answer · 2014-04-21 14:23:58Z

0

You should trim both the values during comparison. Something like this.

if (selected.trim() == answer.trim()) {
    document.getElementById("comparison").innerHTML = "Correct";
} else {
    document.getElementById("comparison").innerHTML = "Wrong";
}

answered Apr 21, 2014 at 14:23

Amit Prajapati

1,1902 gold badges9 silver badges13 bronze badges

Collectives™ on Stack Overflow

Javascript string comparison

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related