2

我有这段代码在函数 valid_name 不为真时显示错误，并valid_name在模糊时变为真时隐藏错误；错误显示在最初隐藏的 div 中。错误出现但不会消失。

function valid_name() {
    if (($("#name").length > 5) && ($("#name").length < 20)) {
        return true;
    } else {
        return false;
    }
}

 $(document).ready(function() {
    $('#name').on('blur', function() {
        if (!valid_name())
            $("#name_erors").text("invalid name").show();
        if (valid_name())
            $("#name_erors").hide();

    });
});
4

4 回答 4

5

我认为

$("#name").length

应该

$("#name").val().length

原因$('#name').length计算找到的元素，但要计算你需要使用的字符

$("#name").val().length

所以功能应该是

function valid_name() {
    if (($("#name").val().length > 5) && ($("#name").val().length < 20)) {
        return true;
    } else {
        return false;
    }
}

你也可以做

function valid_name() {
    var value = $('#name').val(), len = value.length;
    return len > 5 && len < 40;
}
于 2013-09-03T15:58:07.533 回答
2

使用 jQuery 选择时，返回的对象包含元素。在这种情况下，只有一个，所以length永远是 1。您可能打算选择值的长度。

也就是说，这是一个完全优化的 Vanilla JS解决方案：

document.getElementById('name').onblur = function() {
    var notice = document.getElementById('name_errors');
    if( this.value.length > 5 && this.value.length < 20) notice.style.display = "none";
    else {
        notice.style.display = "block"; // or "inline", as applicable
        notice.innerHTML = "Invalid name length (must be between 6 and 19 characters)";
    }
};

此代码应放置在以下任一位置：

  • name元素之后的任何地方
  • 在具有defer属性的脚本块中
  • 在window.onload处理程序中
于 2013-09-03T16:01:07.903 回答
1

我认为你的函数总是返回false。尝试，

function valid_name() {
        if (($("#name").val().length > 5) && ($("#name").val().length < 20)) {
            return true;
        }
        else {
            return false;
        }
    }

 $(document).ready(function() {
            $('#name').on('blur', function() {
                if (!valid_name())
                    $("#name_erors").text("invalid name").show();
                if (valid_name())
                    $("#name_erors").hide();

            });
        });

.val()给出输入字段的值，您应该检查值的长度。

$('#name').length将返回具有 id 名称的元素计数，肯定小于 5。

于 2013-09-03T15:58:36.217 回答
1

您将 div id 拼写为“name_erors”，这似乎是拼写错误。我会先仔细检查 html 中的拼写。

于 2013-09-03T16:02:29.673 回答