確保輸入的名稱不以空格結尾

Question

我試圖獲取它，以便如果鍵入以空格結尾的名稱，文本字段將變爲紅色。大部分的代碼工作只有一個方法似乎沒有工作。

該問題必須在最後一個索引部分的某處？

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/

Answer 1

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

Penultimately，您可以在總結這一切起來一個正則表達式，但如果您打算根據實際錯誤向用戶提供更具體的錯誤消息，那麼我不會那樣做。

function validateName() { 
    return /^(?=.{6})(\S+(\s|$)){2,}$/.test(document.getElementById('name').value); 
} 

最後 - 請記住，不是每個人都有一箇中間名，甚至名稱超過6個字符，如@poke指出。