Javascript 如何在移动应用程序中显示文本输入字段的数字键盘

Javascript 如何在移动应用程序中显示文本输入字段的数字键盘,javascript,android,reactjs,cordova,Javascript,Android,Reactjs,Cordova,我正在使用Cordova+react js构建一个Android应用程序,我需要在输入字段上呈现货币编号。当此输入字段获得焦点时,它显示一个数字键盘 在用户键入一些数字后,它会将数字格式化为文本字符串。例如,如果用户键入394333.2930,它将显示为$394333.293。格式化字符串对我来说没有问题。问题是如何显示文本输入字段的数字键盘 我知道它适用于带有数字类型的输入,但它不允许用户键入、或货币符号。还有数字输入字段,用户可以键入多个点,我不希望出现这种情况。那么,如何在Cordova应

我正在使用
Cordova
+
react js
构建一个Android应用程序,我需要在输入字段上呈现货币编号。当此
输入字段获得焦点时,它显示一个数字键盘

在用户键入一些数字后,它会将数字格式化为文本字符串。例如,如果用户键入
394333.2930
,它将显示为
$394333.293
。格式化字符串对我来说没有问题。问题是如何显示
文本
输入字段的数字键盘

我知道它适用于带有
数字
类型的输入,但它不允许用户键入
或货币符号。还有数字输入字段,用户可以键入多个点
,我不希望出现这种情况。那么,如何在
Cordova
应用程序中为文本输入字段显示数字键盘呢?我不确定这是一个
Cordova
特定的问题还是一个一般的web应用程序问题

我曾尝试使用
tel
,但它仍显示以下屏幕截图中的字符。它们在每个数字后显示为灰色字符。我怎样才能摆脱它们

<input id="numberInput" type="tel" maxlength="6"/>


可能有多种方法,但我也遇到了完全相同的情况,我的做法如下。使用
type=“tel”
并添加对
keydown
事件的检查,以处理不需要的字符,如
“#”、“+”、“*”、“;”、“,”、“-”
。代码如下:

HTML:

希望这对你有帮助

更新:

由于您已经更改了要求,并且根据此新要求,您希望从键盘隐藏特殊字符
这个要求的答案是,不能以正常方式从键盘中隐藏特殊字符也许您可以通过创建自己的自定义键盘来实现。

我已经应用了您的解决方案,但它仍然显示键盘上的字符。@ZhaoYi yes chars显示,但用户将无法输入字符。你想把那些魔咒藏起来吗?你不能隐藏它们。如果您想制作自己的自定义键盘。
<input id="numberInput" type="tel" maxlength="6"/>
// validation for targetSalary input
var invalidChars = ["#", "+", "*", ";", ",", "-"];
numberInput.addEventListener("keydown", function(event) {
  if (invalidChars.includes(event.key)) {
    event.preventDefault();
  }
});