输入范围事件

在一个表单中，有时候需要限定用户输入的数据范围。这时候就需要使用输入范围事件，在用户输入数据时进行验证和限制。

在 HTML 中，输入范围事件有以下几种：

• onblur：在元素失去焦点时触发。
• onchange：在元素的值被改变并失去焦点时触发。
• oninput：在元素的值被改变且每次都在提交表单前立即触发。

其中，onblur 和 onchange 的区别在于，onblur 在元素失去焦点时触发，而 onchange 是在元素的值被改变并失去焦点时触发。因此，onchange 事件发生的频率可能更低一些。

下面是一个例子，使用 onblur 事件限制用户输入的数据范围：

<input type="text" onblur="if (this.value < 0 || this.value > 100) { alert('请输入0到100之间的数字。'); this.value='';}">

这个例子中，当用户输入的数字小于 0 或大于 100 时，会弹出一个提示框，并将输入框的内容清空。

另外，可以使用 HTML5 中新增的一些属性来实现输入范围的限制：

• min 和 max：限制输入框的最小值和最大值。
• step：限制输入框的值增加或减少的步长。

例如，下面的代码使用 min、max 和 step 属性来限制用户输入的数据范围：

<input type="number" min="0" max="100" step="0.1">

在这个例子中，用户只能输入 0 到 100 之间的数字，并且每次增加或减少的步长为 0.1。

总之，使用输入范围事件来限制用户输入的数据范围是非常有用的，能够帮助开发者提高表单的输入质量和数据的安全性。