Javascript 在文本框后面显示验证消息

Question

我正在尝试使用 JavaScript 验证表单。在按钮单击功能上，我调用了一个 JavaScript 函数，在文本框后面显示了消息。我单击按钮的次数与现有验证消息下方显示消息的次数相同。请帮我 这是我的代码:

function check() {
        var v = true;
        if ((document.getElementById('firstname').value == "")) {

            $('#firstname').after('Validation message');
            document.getElementById('firstname').style.borderColor='#DA394B';

            v = false; 

        } 
        if ((document.getElementById('lastname').value == "")) {
            $('#lastname').after('Some validation text');
            document.getElementById('lastname').style.borderColor = '#DA394B';

            v = false;
        }
        return v;
    }

Answer 1

假设我明白 v 的用途。我可能不这么认为，因为 v (我讨厌单字母变量名......)。

试试这个:

function check() {
        var v = true;
        if ((document.getElementById('firstname').value == "")) {

            if ($('#firstnameMessage').length <= 0)
            {
                $('#firstname').after('<p id="firstnameMessage">Validation message</p>');
                document.getElementById('firstname').style.borderColor='#DA394B';
            }

            v = false; 
        } 

        if ((document.getElementById('lastname').value == "")) {
            if ($('#lastnameMessage').length <= 0)
            {
                $('#lastname').after('<p id="lastnameMessage">Some validation text</p>');
                document.getElementById('lastname').style.borderColor = '#DA394B';
            }

            v = false;
        }
        return v;
}

简单的 fiddle 来显示此工作:https://jsfiddle.net/srLt7wo0/