美文网首页
input设置了number还是可以输入符号/e

input设置了number还是可以输入符号/e

作者: 拾钱运 | 来源:发表于2019-12-27 11:26 被阅读0次

因为符号和e也代表数字,如果想要完全控制住还要写正则,但是如果设置了number类型,输入1-、1e等的时候,例如vue,绑定v-model="value" 这个时候绑定不上,只能通过设置类型为text,正则判断只能输入数字,校验。

 <input  type="text"
              placeholder="请输入"
              v-model="doorW.start"
              oninput="if(value.length > 4)value = value.slice(0, 4)"
               @keydown="handleInput2"
            />
  //限制只能输入整数
    inputInt(e) {
      e.target.value = e.target.value.replace(/[^\d]/g, "");
    },
    handleInput2(e) {
      // 通过正则过滤小数点后两位
      e.target.value = e.target.value.match(/^\d*(\.?\d{0,1})/g)[0] || null;
    },

//只能输入整数,pc端试只能输入数字,但是手机还是可以输入其它的字符,还需要自己再校验,例如提交表单的时候验证是否为数字类型
            <input
              type="text"
              placeholder="请输入"
              v-model="FloorArea.start"
              oninput="if(value.length > 3)value = value.slice(0, 3)"
              onkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"
              @keydown="inputInt"
            />

第二种亲测有效( 只能输入数字和小数 不会出现1.1.1的情况)

<input type="text" οnkeyup="!/^(\d+\.?)?\d{0,2}$/.test(this.value)?(this.value=this.value.substring(0, this.value.length-1)): ''"/>

亲测有效 (只能输入整数)

<input placeholder="请填写" type="text" style="width:72%" v-model="rentTime" oninput="if(value.length > 5)value = value.slice(0, 5)" onkeyup="!/^(\d+?)$/.test(this.value)?(this.value=this.value.substring(0, this.value.length-1)): ''" />

相关文章

网友评论

      本文标题:input设置了number还是可以输入符号/e

      本文链接:https://www.haomeiwen.com/subject/wmaroctx.html