让HTML5数字输入仅接受整数？

洞，残缺不全的实现，等等。

整体概念是合理的：使用 HTML 5 属性来限制可以发送到服务器的内容，然后使用 Javascript 增强它，以限制用户可以在第一个地方输入的内容。

所以让我们来看看这些问题，并更好地实现它。

问题 1，不好的脚本

最常见的缺陷是缺乏适当的降级功能。如果您要在“electron”或“nw.js”中构建完整的堆栈应用程序，那很好，但是这种形式的东西通常在面向公众的网站中没有位置。

就像我经常说的那样，高质量的脚本应该增强已经在工作的页面，而不是用户使用它的唯一方法。

解决办法?

使用 pattern 和 step 属性来限制有效内容。

问题 2，正则表达式模式错误或不完整

人们最常用的模式是 [-/ d] *，它的问题是允许在任何地方都减号。虽然肯定可以使用 type = “number” 来解决问题，但这不是一个好选择。截取按键时更是如此，因为减号只能是第一个字符。

它还可能出现问题，因为某些实现“不是”正则表达式，这会导致误报。

解决办法?

对于 HTML，使用更好的表达式：^[- d]d*$ 更加健壮和准确。减号可以是匹配开始的第一个字符，然后是零个或多个小数，直到字符串结束。

对于 JavaScript，只使用正则表达式来测试数字，并应用一些更实用的逻辑来检测其他值。

简单易行!

问题 3，在标记中使用事件属性

我知道在 JSX 垃圾中，有大量的用嘴呼吸的人在鼓励这一点，但如果你在写 vanilla 或其他系统，请出于对圣诞节的爱，从 1997 年的直肠中取出你的头颅。

将 “onkeypress” 或 “onchange” 放在标记中意味着错失了一次缓存机会，也违反了分离关注的原则。以这种方式将 JavaScript 放进标记中，就像在 HTML 4 Strict 中被废弃的所有东西一样，愚蠢得令人发指。就像如果你要用 “text-white box-shadow col-4-s” 这样的属性在你的 HTML 上撒尿一样，请你承认失败，然后回到写 HTML 3.2 的时候，用所有那些 FONT / CENTER 标签、COLOR、BGCOLOR、SIZE、BORDER 和 ALIGN 属性，以及 "用于布局的表格 "来写，你们似乎都很清楚地、很珍视地错过了。

这也意味着您没有完整/适当的事件处理程序访问权限。

解决办法?

Element.addEventListener，请使用它!

问题 4，必须对每个输入进行硬编码

无论是通过问题 3 将事件属性放到标记中，还是通过手动获取唯一 ID 来捕获它们，我几乎没有发现可以实际使用即插即用的标记应用程序的代码库!

解决办法?

（编辑：滨州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!