确保输入的名称不以空格结尾

Ensuring that an entered name doesn’t end with a space

本文关键字：空格 结尾 输入 确保      更新时间：2023-09-26

我试图得到它，所以如果我输入一个以空格结束的名称，文本字段将变成红色。大部分代码都可以工作，只有一个方法似乎不起作用。

问题一定在最后一个索引部分的某个地方?

var NamePass = true;
function ValidateName() {
    var BlankPass = true;
    var GreaterThan6Pass = true;
    var FirstBlankPass = true;
    var BlankMiddleName = true;
    if (document.getElementById('Name').value == "") {
        BlankPass = false;
    }
    var Size = document.getElementById('Name').value.length;
    console.log("Size = " + Size);
    if (Size < 7) {
        GreaterThan6Pass = false;
    }
    if (document.getElementById('Name').value.substring(0, 1) == " ") {
        FirstBlankPass = false;
    }
    var LastIndex = document.getElementById('Name').value.lastIndexOf();
    if (document.getElementById('Name').value.substring((LastIndex - 1), 1) == " ") {
        FirstBlankPass = false;
    }
    string = document.getElementById('Name').value;
    chars = string.split(' ');
    if (chars.length > 1) {} else
        BlankMiddleName = false;
    if (BlankPass == false || GreaterThan6Pass == false || FirstBlankPass == false || BlankMiddleName == false) {
        console.log("BlankPass = " + BlankPass);
        console.log("GreaterThan6Pass = " + GreaterThan6Pass);
        console.log("FirstBlankPass = " + FirstBlankPass);
        console.log("BlankMiddleName = " + BlankMiddleName);
        NamePass = false;
        document.getElementById('Name').style.background = "red";
    } else {
        document.getElementById('Name').style.background = "white";
    }
}
http://jsfiddle.net/UTtxA/10/

lastIndexOf获取字符的最后一个索引，而不是字符串的最后一个索引。我想你的意思是用length代替:

var lastIndex = document.getElementById('Name').value.length;

另一个问题是，substring需要一个开始和结束索引，而不是一个开始索引和子字符串长度。您可以使用substr代替，但charAt更容易:

if (document.getElementById('Name').value.charAt(lastIndex - 1) == " ") {
    FirstBlankPass = false;
}

现在，对于一些一般的代码改进。与其在true处开始所有变量并有条件地将它们设置为false，不如将它们设置为条件:

var NamePass = true;
function ValidateName() {
    var value = document.getElementById('Name').value;
    var BlankPass = value == "";
    var GreaterThan6Pass = value.length > 6;
    var FirstBlankPass = value.charAt(0) == " ";
    var LastBlankPass = value.charAt(value.length - 1) == " ";
    var BlankMiddleName = value.split(" ").length <= 1;
    if (BlankPass || GreaterThan6Pass || FirstBlankPass || LastBlankPass || BlankMiddleName) {
        console.log("BlankPass = " + BlankPass);
        console.log("GreaterThan6Pass = " + GreaterThan6Pass);
        console.log("FirstBlankPass = " + FirstBlankPass);
        console.log("BlankMiddleName = " + BlankMiddleName);
        NamePass = false;
        document.getElementById('Name').style.background = "red";
    } else {
        document.getElementById('Name').style.background = "white";
    }
}

还有几个注意事项:

    使用camelCase变量名而不是PascalCase变量名可能是一个好主意，后者通常是为构造函数保留的
  • blah == false应该写成!blah
  • 一个空的if后面跟着一个else也可以用if (!someCondition)代替
  • 该函数看起来应该返回true或false，而不是设置全局变量NamePass
最后，您可以在一个正则表达式中总结这一切，但如果您打算根据实际错误向用户提供更具体的错误消息，那么我不会这样做。 
function validateName() {
    return /^(?=.{6})('S+('s|$)){2,}$/.test(document.getElementById('name').value);
}

最后-请记住，不是每个人都有中间名，甚至不是一个超过6个字符的名字，正如@poke指出的。

相关文章：