Question

我整理了一个代码，在 input 字段中写了一个单词，而 output 显示了相同的单词，但带有@附加，每个单词之间有一个空格。到目前为止，我的代码是半功能性的，可以完成我想做的事情，但是有一些问题。

我需要一些帮助：

1。。我需要确保输出字符之间始终有一个空格。如果用户输入（类型或粘贴）带有多于一个“空格”的句子，则输出会将其缩小到一个空格。如您所见：

当前，如果您输入：西红柿，橙子，（双空格）苹果，它将输出@tomato @orange @ @apple。

我希望它的输出是：@tomato @orange @apple（删除多余的@，由于双倍的空格而被插入）

2。。当删除输入字段中键入的所有内容时，输出仍显示“ @”。如果要删除输入字段，我希望输出像输入一样空白。

代码如下：

function atPrefix (text) {
  return text
    .split(' ')
    .map(character => '@' + character)
    .join(' ')
}

<textarea  id="specialInput" type="text"  oninput="document.querySelector('#output').innerText = atPrefix(this.value)"></textarea>

<p> <textarea
id="output">
</textarea>
</p>

Answer 1

添加一个filter()函数以过滤出仅由空格组成的所有令牌：

function atPrefix (text) {
  return text
    .split(' ')
    .filter(token => token.trim() !== '') 
    .map(token => '@' + token)
    .join(' ')
}

<textarea  id="specialInput" type="text"  oninput="document.querySelector('#output').innerText = atPrefix(this.value)"></textarea>

<p> <textarea
id="output">
</textarea>
</p>

Answer 2

类似的事情应该起作用

function atPrefix (text) {
  if(text) {
     return text
       .replace(/\s\s+/g, ' ')
       .split(' ')
       .map(character => '@' + character)
       .join(' ')
   } else {  return text }  
}

因此，基本上，您是在检查文本是否不是空字符串，并通过正则表达式将多个空格字符替换为单个空格。

Answer 3

您的代码很好，但拆分后只使用array.filter（e => !! e）;

function atPrefix (text) {
  return text.split(' ')
    .filter(word => !!word)
    .map(word => '@' + word.trim())
    .join(' ')
}

<textarea  id="specialInput" type="text"  oninput="document.querySelector('#output').innerText = atPrefix(this.value)"></textarea>

<p> <textarea
id="output">
</textarea>
</p>

Answer 4

您可以在这里找到此正则表达式的解释：https://regexr.com/4qgs7

function atPrefix (text) {
  return text.replace(/\b(\w+)\b/gm,"@$1");
}

<textarea  id="specialInput" type="text"  oninput="document.querySelector('#output').innerText = atPrefix(this.value)"></textarea>

<p> <textarea
id="output">
</textarea>
</p>

Answer 5

使用正则表达式将“，？\ s +”替换为“ @”，并在前缀前加上@；仅当字符串不为空时才进行字符串操作。这将解决您的第二个问题。

在每个单词前添加“ @”，再在每个单词之间添加一个空格（JavaScript）？

5 个答案: