javascript - 为什么当我使用 "and"或 "or"时我的替换在 javascript 中正常工作，但当我使用 "&"或 "/"或 "+"时却不能

Question

我在 HTML 表单中输入了一个名字，有时用户会输入两个名字，我需要去掉第二个名字以及用于连接它们的单词或字符。如果我使用“and”这个词或“or”这个词，我的 javascript 可以正常工作并删除第二个名字和用来连接它们的词。但是，如果我使用与符号 (&) 或加号 (+) 或正斜杠 (/)，无论我如何编码，它只会去掉第二个名字的最后一个字符，而不是连接字符或除最后一个字符外的任何第二个名字。

我已经尝试使用字符串函数、正则表达式，在 regex.com 上测试我的正则表达式(他们在那里工作并正确选择单词和连接词)，我的正则表达式的十几种不同变体在 regex 上都能正常工作, com 选择我要删除的文本，但这些都不适用于我的实际表单。

例如，如果我输入:“鲍勃和戴夫”我得到“鲍勃” - 正确“鲍勃或戴夫”我得到“鲍勃” - 正确

但是如果我输入:“鲍勃和戴夫”我得到“鲍勃和戴夫”-不正确“Bob + Dave”我得到“Bob + Dav” - 不正确“鲍勃/戴夫”我得到“鲍勃” - 不正确但可以接受“鲍勃，戴夫”我得到“鲍勃，戴夫” - 不正确

这是我使用过的一些代码，几种不同的方法对前两个有效，对后四个无效。

“鲍勃和戴夫”的作品:

function noExtraNames() {
var pattern=document.forms[0].first_name.value;
var z = pattern.search(/(\s)*\w+/gi)
var x = pattern.search("AND", z+1)
if (z < x) {
    alert('Please only enter ONLY ONE FIRST NAME')
    document.forms[0].first_name.focus();
    return document.forms[0].first_name.value=pattern.replace(/\s(AND)*\w+/gi, "");
}
}

“鲍勃或戴夫”的作品:

function noExtraNames() {
var pattern=document.forms[0].first_name.value;
var z = pattern.search(/\s(OR)*\w+/gi)
var x = pattern.search("OR", z+1)
if (z < x) {
    alert('Please only enter ONLY ONE FIRST NAME')
    document.forms[0].first_name.focus();
    return document.forms[0].first_name.value=pattern.replace(/\s(or)*\w+/gi, "");
}
}

这也适用于“Bob and Dave”，并将相应的单词“and”更改为“or”，适用于“Bob or Dave”:

function noExtraNames() {
var pattern=document.forms[0].first_name.value;
var z = pattern.search("and")
var x = pattern.search("and")
if (z < x) {
    alert('Please only enter ONLY ONE FIRST NAME')
    document.forms[0].first_name.focus();
    return document.forms[0].first_name.value=pattern.slice(0, z);
}
}

然而，这适用于不正确但可接受的“Bob，Dave”，但不适用于“Bob & Dave”或“Bob/Dave”，当适当的字符被替换时:

function noExtraNames() {
var pattern=document.forms[0].first_name.value;
var z = pattern.search(/(,\s+)/gi);
var x = pattern.search((/(,\s+)/gi), z-1);
if (z < x) {
    alert('Please only enter ONLY ONE FIRST NAME');
    document.forms[0].first_name.focus();
    return document.forms[0].first_name.value=pattern.replace(/(,\s+)/gi);
}
}

这会产生与“&”和“/”相同的错误结果:

function noExtraNames() {
var pattern=document.forms[0].first_name.value;
var z = pattern.search(/(\s&)/gi);
var x = pattern.search(/(\s&\s.[a-z].+)/gi, z-1);
if (x < z) {
    alert('Please only enter ONLY ONE FIRST NAME');
    document.forms[0].first_name.focus();
    return document.forms[0].first_name.value=pattern.replace(/(\s&\s.[a-z].+)/gi, "");
}
}

正则表达式都可以在 regex.com 上选择正确的文本，但在我的表单中从来没有用过，我几乎无法忍受沮丧。

为什么会发生这种情况，更重要的是我该如何解决。我尝试了在此站点上找到的其他几种解决方案，例如:

function noExtraNames() {
var pattern=document.forms[0].first_name.value;
var z = pattern.search(/(,\s+)/gi);
var x = pattern.search((/(,\s+)/gi), z-1);
if (x < z) {
    alert('Please only enter ONLY ONE FIRST NAME');
    document.forms[0].first_name.focus();
    var s = document.forms[0].first_name.value;
    var n = s.indexOf('&');
    s = s.substring(0, n != -1 & n : s.length);
    return document.forms[0].first_name.value = s;
}
}

一切都不快乐。

预期的输出是:Bob实际输出为:Bob & Dav

Answer 1

似乎通过拆分正则表达式并返回第一项可以更好地处理这个问题。此模式应处理您帖子中提到的情况:

var pattern = /(\s*[\+|&|\,|\/]\s*|\s+(and|or)\s+)/i;

然后拆分并始终返回第一个元素。

function noExtraNames(name) {
  var pattern = /(\s*[\+|&|\,|\/]\s*|\s+(and|or)\s+)/i;
  var items = name.split(pattern);
  if (items.length > 1) {
    console.log('Please only enter ONLY ONE FIRST NAME');
    return items[0];
  }
  return name;
}

let tests = [
  'Bob',
  'Billy Bob',
  'Bob and Dave',
  'Bob + Dave',
  'Bob & Dave',
  'Bob / Dave',
  'Bob, Dave',
  'Igor',
  'Andy',
  'Bob+Dave',
];

for (let test of tests) {
  console.log(test, '===> ', noExtraNames(test));
}