Question

我想知道当用户验证其答案时如何更改我的脚本以显示正确的反馈图像。

我的函数有一个包含正确答案的数组和一个用于存储用户答案的空数组。

当我验证时，我需要显示字段的反馈图像（如果正确显示，如果显示错误并将反馈图像替换为另一个）。

这是我的代码：

$(document).ready(function () {

            $("#validateButton").click(function schimbare() {
                $(".feedback").show();
                $('.feedback').attr('src', 'res/wrong.svg');
            });

        });


//verificam daca raspunsul este corect

function checkAnswer()
{
    var inputTF = document.getElementsByTagName('input');
    for (i = 0; i < inputTF.length; i++)
    {
        if (inputTF[i].value == raspunsuri[i]){
            user.push(inputTF[i].value);
            $(".feedback").show();
        }
        else
        {
            user.push("");
            schimbare();

        }
        }

};

Answer 1

在您的javascript中，您正在为#validateButton定义onClick处理程序。在你的html中，你在#validateButton上有一个onclick属性，它调用了一个不同的函数。这令人困惑。我建议删除这两个并定义一个验证函数，它将负责在输入字段旁边呈现正确/错误的图像：

var validate = function () {
    $('input').each(function () {
        var $this = $(this);
        var answer = $this.attr('correct');
        var value = $this.val();
        var src = (answer === value) ? 'res/correct.svg' : 'res/wrong.svg';
        $this.closest('.box').find('img.feedback').attr('src', src);
    });
};

现在让我们使用jQuery将我们的验证方法连接到#validateButton点击事件：

$("#validateButton").on('click', validate);

如何检查多个输入字段

1 个答案: