javascript - 当文本框值与另一个 div 的内容相同时显示 div

Question

我正在做一个测验，答案是随机的。我想要“正确！” div 显示文本框值何时与另一个 div 相同。

这是我到目前为止所得到的：

$(document).ready(function(){
    $("#buttontest").click(function(){
        if ($('#full_day').val() == '#answer') {   
            $("#correct").show("fast"); //Slide Down Effect
        } 
        else {
            $("#correct").hide("fast");    //Slide Up Effect
            $("#incorrect").show("500").delay("1000").hide("500");
        }
    });
});

<p>What is the animal?</p>
<div id="correct">
    That's Correct!
</div>
<div id="incorrect">
    Sorry, Try again!
</div>
<div id="answer">Monkey</div>
<input type='text' id="full_day"/>
<input type='button' id="buttontest" value="clickme"/>

Answer 1

利用

$('#answer').text()

而不仅仅是

'#answer'

在 if 语句中。

Answer 2

$(document).ready(function(){
    $("#buttontest").click(function(){

        if ($('#full_day').val() == $('#answer').html()) {   
            $("#correct").show("fast"); //Slide Down Effect
        } 
        else {
            $("#correct").hide("fast");    //Slide Up Effect
            $("#incorrect").show("500").delay("1000").hide("500");
        }
    });
});

<p>What is the animal?</p>
<div id="correct" style="display:none;">
    That's Correct!
</div>
<div id="incorrect" style="display:none;">
    Sorry, Try again!
</div>
<div id="answer" style="display:none;">Monkey</div>
<input type='text' id="full_day"/>
<input type='button' id="buttontest" value="clickme"/>

Answer 3

if ($('#full_day').val() == $('#answer').text())

这是区分大小写的。使其不区分大小写：

if ($('#full_day').val().toLowerCase() == $('#answer').text().toLowerCase())

编辑：根据要求，这是一个允许多个答案的解决方案：

$('#check').bind('click', function() {
    var possibleAnswers = $('#answers').text().toLowerCase().split(' ');
    var givenAnswer = $('#user-answer').val().toLowerCase();
    var isAnswerCorrect = false;
    for (var indexPossibleAnswers = 0; indexPossibleAnswers < possibleAnswers.length; indexPossibleAnswers++)
    {
         if (possibleAnswers[indexPossibleAnswers] == givenAnswer)
         {
              isAnswerCorrect = true  
              break;
         }
    }
    if (isAnswerCorrect)
    {
         alert('Correct');   
    }
    else 
    {
         alert('Incorrect, try again.');   
    }
});

现场演示。