用点替换逗号答案

【问题标题】：replace comma with dot on fly用点替换逗号
【发布时间】：2019-04-15 10:33:47
【问题描述】：

我试图在输入类型“文本”中用“点”替换“逗号”。目前在我的代码中，我限制了我的模式"^([0-9]*[.])?[0-9]*$"，但我想允许用户输入“逗号”（,）但自动替换为“句号”（.）

<input
  type="text"
  ref="double"
  pattern="^([0-9]*[.])?[0-9]*$"
  onKeyUp={this.validateKeyEvents.bind(this)}
  value={this.state.value}
  onChange={this.inputChanged.bind(this)}
/>



validateKeyEvents(event){
    console.log("event occured" + event.charCode);
    var keyVal = event.charCode;
    if(keyVal == 188)
    {
      console.log("comma");
      event.preventDefault();
      var UserInput = ReactDOM.findDOMNode(this.refs.double).value;
      UserInput = UserInput.replace(/,/g, ".");
      return true;
    }
    else if(keyVal == 8 || keyVal == 46)
      return true;
    else if(keyVal == 0)
      return true;
    else if (keyVal == 9 || keyVal == 13 || keyVal == 110 || keyVal == 190)
      return true;
    else if(keyVal >=48 || keyVal <= 57)
      return true;
    else if(keyVal >= 96 || keyVal <= 105)
      return true;
    else if(keyVal >=35 || keyVal <=40)
      return true;
    else
      return false;
  }



inputChanged(event) {
    var value = event.target.validity.valid
      ? event.target.value
      : this.state.value;
    this.setState(
      {
        value: value
      });
  }

【问题讨论】：

既然你在使用 React，为什么不在你要去的地方处理它setState？
你的意思是在设置值的状态时用句号替换逗号并显示它？
是的。这正是我的意思。
好的，我试了一下，但失败了。你能提供一些如何处理的提示吗？目前它以下列方式工作。 1. 用户可以输入 1.01 例如 2. 用户不能输入多个“句号”。我当前的问题是：当用户输入“逗号”时，我想以接受“逗号”但将其转换为“句号”的方式进行处理。例如，当用户输入 1,02 时，它应该显示 1.02跨度>

标签： javascript regex reactjs input

【解决方案1】：

您可以简单地将替换后的字符串作为 input 的值传递：

<input 
  value={this.state.value.replace('.', ',')} 
  onChange={e => this.setState({value: e.target.value})} ... />

只需将您的模式更改为使用逗号而不是点。

pattern="^([0-9]*[,])?[0-9]*$"

【讨论】：

【解决方案2】：

所以我做了以下更改：

在我添加的 validateKeyEvents 中

if(keyVal == 188)
{
  return true;
}

在输入中

              <input
                type="text"
                pattern="^([0-9]*[.?,])?[0-9]*$"
                onKeyUp={this.validateKeyEvents.bind(this)}
                value={this.state.value.replace(',','.')}
              />

【讨论】：