时间戳

首页 > 解决方案 > IOS emdash删除前一个字符

javascript - IOS emdash删除前一个字符

问题描述

我有一个文本文件，它只允许字母和数字。但是，当 ios 用户通过双击破折号“ - ”插入破折号时，它将删除它之前的任何字符。这只发生在ios设备上

我正在使用正则表达式来立即过滤输入。这是我的代码：

let text = event.target.value;
let regref = new RegExp(/[^a-zA-Z0-9]/g);
text  = text.replace(/[^a-zA-Z0-9\s\-\—]/g,"");
let str = event.target.value;


let text = event.target.value;
let regref = new RegExp(/[^a-zA-Z0-9]/g);
text  = text.replace(/[^a-zA-Z0-9\s\-\—]/g,"");
let str = event.target.value;


if (str.length > 6) { 
  event.preventDefault();
  return;
}
setTimeout(function(){
  if (!regref.test(text)) {
    event.preventDefault();
  }
  text = text.replace('_', "");

  text = text.replace('-',"");
}, 200);
setReferralCode((referralCode = caps));

注意文本 = text.replace(/[^a-zA-Z0-9\s-\—]/g,""); 我已经允许 - 和 - 希望我可以显示错误消息而不是阻止其输入，但是即使如果输入：“aaabbb”后跟双破折号，字符串也会更改为“aaabb-”。

   **FIXED UPDATE**

一位同事通过使用 _.debounce() 帮助我解决了这个问题；并且有一个临时变量来存储以前的有效代码。它看起来像这样：

 let text = event.target.value as string;
console.log(text);
var emRegExp = new RegExp(/[–—\s\.]/g);
if (text[text.length - 1] == "-" || emRegExp.test(text[text.length - 1])) {
  text = lastReferralCode
    .replace(/[^a-zA-Z0-9]/g, "")
    .replace(/\s/g, "")
    .toUpperCase()
    .trim()
    .substr(0, 6);
} else {
  text = text
    .replace(/[^a-zA-Z0-9]/g, "")
    .replace(/\s/g, "")
    .toUpperCase()
    .trim()
    .substr(0, 6);
  setIsDashBefore(false);
}

我想分享这个，以防将来有人遇到同样的问题。这对于一些基于 Web 的超级应用程序来说可能很麻烦。如果使用某些 android 键盘输入双“空格”，Android 设备将删除前一个字符。而 iPhone 的双“-”字符也是如此。正如@A Haworth 提到的那样，ios 或 android 正在处理导致问题的双重字符。

标签： javascriptiosreactjsvalidation

解决方案

看起来您的代码有可能遇到计时问题 - 系统正在处理破折号，同时代码正在尝试处理它。

IOS 接收'-' 字符的活动是查看输入中的前一个字符是否也是'-'。如果是，则将两者转换为单个字符空间。到那时，尽管任何事件监听代码都看到了两个连字符。

如果我们“干扰”并从字符串中删除第一个连字符 IOS 是“混淆”并删除它认为是两个“-”字符，这意味着它将删除输入值字符串中的下一个字符。

为了解决这个问题，我们可以查找连字符而不是立即将其从输入值中删除。

这是一个片段，将事件视为 keyup 事件：

const input = document.querySelector('input');
let timing = false; //set to true if we have a timeout set
let lastChWasHyphen = false; //set to true on every odd numbered hyphen

function keyup(event) {
  
  if ( event.key == '-' ) { 
    if (!lastChWasHyphen) { alert('You cannot have a - character'); }
    lastChWasHyphen = !lastChWasHyphen;
  }
  else { lastChWasHyphen = false; }
 
  if (!lastChWasHyphen) { input.value  = input.value.replace(/[^a-zA-Z0-9]/g,""); }
}

input.addEventListener('keyup',keyup);
<input />

缺点：在键入另一个字符之前，连字符不会被删除。例如，在此设置超时是不安全的，因为用户可以键入连字符两次并留有间隙以在 IOS 上获得 emspace。在这里唯一要做的就是在问题中建议的奇数字符上发出警告消息。

警告：这个问题专门关于 IOS 允许输入 emspace。我不知道IOS，或者任何其他系统，是否有其他特殊的双字符映射到单字符的方法。

推荐阅读