验证输入字段 Fullname(Firstname,Lastname) - JavaScript答案

【问题标题】：Validation input field Fullname(Firstname,Lastname) - JavaScript验证输入字段 Fullname(Firstname,Lastname) - JavaScript
【发布时间】：2019-04-24 13:16:20
【问题描述】：

需要验证全名（名字/姓氏 - 1 个输入字段）。我是这个领域的新手，无法制定正确的语法，也许也可以使用正则表达式

<form name="myForm" action="#" id="form" onsubmit="return validateForm()" method="POST">
            <div class="field"><span class="input"><i class="fas fa-user-alt"></i>
                    <input type="text" id="name" name="Fullname" placeholder="Full Name" >
                </span>


function validateForm() {
var name= document.getElementById('name').value;
var x = name.indexOf(" ");
var fname = name.substring(0, x);
var lname = name.substring(x).trim();
if ( 17 < fname.value.length < 5 || 4 > lname.value.length > 17 || x.value.length != 1) {
    alert("try again")
    return false;
 }
 alert("OK")
return true;
}

该字段（1 个字段）应包含 2 个单词，应为 3 到 20 个符号。

编辑：似乎工作..终于！

function input (name) {
  let fullNameArr = name.split('')
  const space = ' '
  let firstName = ''
  if (fullNameArr.includes(space)) {
    for (let i = 0; i < fullNameArr.length; i++) {
      if (!firstName.includes(space)) {
        firstName += fullNameArr[i]
      }
    }
  }
  firstName = fullNameArr.splice(0, firstName.length)
  const lastName = fullNameArr
  if (firstName.length > 3 && firstName.length <= 21 && lastName.length >= 3 && lastName.length <= 20 && lastName.includes(space) === false) {
    console.log(firstName)
    console.log(lastName)
  } else {
    console.log('Invalid Name')
    return false
  }
}
input('Todor Markov')

【问题讨论】：

如果我的名字是“Johnny Van Patton Jr.”怎么办？回复：2个字
这些是 4 个字..要求是 2 个字..
通常我将 this17 < fname.value.length < 5 视为您的 3 到 20 的 fname.value.length < 21 && fname.value.length > 2
17 < fname.value.length < 5 with "foobar" as fname.value，这将像这样执行：17 < "foobar".length < 5 => 17 < true => false。所以17 < fname.value.length < 5 将始终被评估为false
@greedchikara 注意\w，因为它不匹配重音字母。例如，/^\w{3,20} \w{3,20}$/.test("Sébastien Lor") 的计算结果为 false。

标签： javascript validation input

【解决方案1】：

您的模型对名称做了几个假设。通常将名字和姓氏作为单独的输入框来消除这个障碍。

从用户体验的角度来看，如果您不打算有单独的字段，则需要使用工具提示进行一些验证，检查用户是否有多个空格，提醒他们必须输入FirstName LastName。

从正则表达式验证的角度来看，这里有一个确保其有效的全部内容。
/^[a-z ,.'-]+$/i.test("Johnny 'Van' Pat-ton Jr.") 没有数字，但允许字母和特殊字符,.'-。

【讨论】：

您的正则表达式不会匹配重音字母，这在许多非英语名称中很常见。