学堂 学堂 学堂公众号手机端

如何实现HTML页面input只输入数字

lewis 1年前 (2024-03-23) 阅读数 4 #技术
这篇文章给大家分享的是如何实现HTML页面input只输入数字。小编觉得挺实用的,因此分享给大家做个参考,文中的介绍得很详细,而要易于理解和学习,有需要的朋友可以参考,接下来就跟随小编一起了解看看吧。



如果想让input文本框只能输入数字,也就是不带小数点的正整数数字,这个时候需要将我们的input文本框修改一下,html代码如下。

<inputonkeyup="this.value=this.value.replace(/\D/g,'')"onblur="this.value=this.value.replace(/\D/g,'')">

onkeyup:表示键盘在输入数字的时候,如果输入了除数字以外的所有字符,该字符都将被替换为空、

onblur:表示当光标失去焦点时,除了数字以外的所有字符都将被替换为空,这就防止了有人不用键盘,而用鼠标直接复制粘贴一个小数而不能替换的问题。

有很多js教程是这样的,把onblur事件部分换成onafterpaste,其实都是错误的!都是复制粘贴党,如下这种情形。

<inputonkeyup="this.value=this.value.replace(/\D/g,'')"onafterpaste="this.value=this.value.replace(/\D/g,'')">

告诉各位,根本就没有所谓的paste相关的事件,如onbeforepaste,onafterpaste,onpaste,这些都是错误的,别被误导了。



关于“如何实现HTML页面input只输入数字”就介绍到这了,如果大家觉得不错可以参考了解看看,如果想要了解更多,欢迎关注博信,小编每天都会为大家更新不同的知识。
版权声明

本文仅代表作者观点,不代表博信信息网立场。

热门