如何只强制输入数字，没有Javascript？

如果您真的想要防止非数字字符进入现场，那么答案是肯定的，你需要使用Javascript（最好的选择是把它放在 keyUp 事件中） 。

您还应该小心确保您在客户端上执行的任何验证也会在服务器上进行复制，因为可以进行任何客户端验证（无论是通过HTML5输入字段或通过您自己的自定义JavaScript）可以被恶意用户绕过。

CodePen: codepen.io/leongaban/pen/hbHsk

I've found multiple answers to this question on stack here and here

However they all suggest the same fix, using type="number" or type="tel"

None of these are working in my codepen or project :(

Do you see what I'm missing?

Firstly, what browsers are you using? Not all browsers support the HTML5 input types, so if you need to support users who might use old browsers then you can't rely on the HTML5 input types working for all users.

Secondly the HTML5 input validation types aren't intended to do anything to stop you entering invalid values; they merely do validation on the input once it's entered. You as the developer are supposed to handle this by using CSS or JS to determine whether the field input is invalid, and flag it to the user as appropriate.

If you actually want to prevent non-digit characters from ever getting into the field, then the answer is yes, you need to use Javascript (best option is to trap it in a keyUp event).

You should also be careful to ensure that any validation you do on the client is also replicated on the server, as any client-side validation (whether via the HTML5 input fields or via your own custom javascript) can be bypassed by a malicious user.