时间戳

首页 > 解决方案 > 在一些随机数字之后在字符串中添加空格

javascript - 在一些随机数字之后在字符串中添加空格

问题描述

我正在尝试在用户键入时向我的输入值添加空格，它适用于恒定数字，例如 4 个字母或 5 个字母之后。但是我无法在某些数字之后动态添加空格。

例如

如果用户输入 1234567890

块：[3,3,4]

预期产出：123 456 7890

如果用户输入 1234567890

块：[3,2,2,3]

预期产出为：123 45 67 890

标签： javascriptjqueryarraysstring

解决方案

处理用户类型的输入可能很棘手。

虽然不完美，但一种解决方案是计算预期结果应该是什么，然后与当前的结果进行比较。如果它们不同，则使用计算的输入更新实际输入。

下面是一个简单的例子，它甚至可以处理用户粘贴的数字。下面的一个问题是光标位置，如果说您在中间插入了数字，但这可以通过记住光标位置和恢复来处理。

const splits = [3,3,4];
$('#a').on("input", function(){
  let count = 0;
  const breaks = splits.map(m => { const ret = m + count; count += m; return ret; });
  const a = this.value.split("").filter(f => f !== ' ');
  const s = a.map((m, ix) => {
    if (breaks.includes(ix + 1)) return m + " "
    else return m;
  }).join("");
  if (this.value.trim() !== s.trim()) this.value = s;
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="a"/>

推荐阅读