为什么type =“ number”属性会在Firefox中中断解析?

时间:2019-02-13 12:31:43

标签: html firefox vue.js input attributes

我有一个只能包含一组字符的输入字段,这是通过通过正则表达式解析输入值来完成的。只要我不添加属性type =“ number”,它就可以在Firefox中工作。

脚本是错误的还是vue或firefox中的错误?

此处的代码为jsFiddle

new Vue({
  el: "#app",
  data: {
    message: ""
  },
  methods: {
    mask(input) {
      const validCharsForNumberFields = /[0-9]*(,|\.)?[0-9]*/gm
      this.message = input.target.value.match(validCharsForNumberFields)[0]
    }
  }
})
<script type="text/javascript" src="https://unpkg.com/vue"></script>
<div id="app">
  <div>
    <!-- Remove the type="number" attribute to make the parsing work in firefox -->
    <input @input="mask" v-model="message" type="number" placeholder="Try numbers">
    <p>Message is: {{ message }}</p>
  </div>
</div>

edit:顺便说一下,本文中的摘录行为与jsFiddle上的代码不同。不知道为什么。我会设法弄清楚。同时,jsFiddle版本的行为与在本地运行此代码的行为相同。

0 个答案:

没有答案