粘贴到输入字段

时间:2017-10-18 13:30:39

标签: javascript reactjs react-native

我的输入字段只是一个输入字段而不是输入框,而且你无法在其中创建新行的继承事实是我想要的和预期的。

我愚弄我的应用程序。

如果一个Jhon Dumb ctrl-V的文本包含一个新行(或者我的RULESET中的任何其他内容),我如何阻止它触发更新事件并落入!== ''案例?

RULESET:

 const validator = /^(?!.*\.\.)(?!.*\-\-)(?!.*\.$)[^\W\_][A-Z0-9\.\-\_]{0,50}$/igm;
 const allow = validator.test(inputValue);
 if (allow) {
 ...do stuff
 }

我试过这个(放在验证器上面):

const inputValue = event.target.value.replace(/\n/g, '').toUpperCase();
我从这里拿到了

regex - replace multi line breaks with single in javascript

但是inputValue,经过它仍然不是=== ''(因为它有效),所以UpdateInput代码仍然执行。

如果它与内容一起执行,它可以显示没问题。

但是现在结果是用户获得了他的输入正在更新但是内容为空的视觉反馈。 (显然。但是我不能说谁在这里介入以及我们如何从MY_INPUT\n到====> (事实上我很想知道它为什么会这样这样做))。

也许这已经过滤掉了错误的输入,但在这种情况下,我需要一种方法来阻止任何代码执行。

但理想情况下我会“纠正”用户输入。

要澄清:

这仅适用于CTRL-V场景。当您只是按预期输入输入时,输入键不起作用。

谢谢!

1 个答案:

答案 0 :(得分:2)

输入元素应该已经从任何文本中删除\n

来自MDN

  

单行文字字段。换行符会自动从输入值中删除。

如果问题是您正在检查''并且它失败了,那么您可能需要使用.trim()方法。

if (inputValue.trim() !== '') {}

可以缩短为: if (!inputValue.trim()) 因为空字符串是假的,如果它符合你的风格。