oninput事件和onchange事件的区别?

简介: oninput事件和onchange事件的区别?

oninput事件多用于input输入框,onchange事件多用于select下拉框,这两个事件的用途也是非常广泛,在我前面发的博文中,也有相关提示,下面我就详细的讲解一下吧!

这两者都是很常见的表单事件,oninput事件:只要输入东西,就会立即触发,无论是复制还是粘贴都会触发;onchange事件:单你点击某个元素值,失去焦点时触发。

<input type="text" oninput="handleInput(event)">
<select  onchange="handleChange(event)"></select>
 

使用onchange事件时,需要注意的是,在用户输入完成之前,如果用户点击其他元素或按下了回车键,输入框的值将被提交,同时onchange事件也会被触发,这可能导致一些意想不到的结果。

这两个事件各有各的好,我们可以根据实际情况去选择,可以考虑用户的体验性。

需要注意的是,当表单元素的值发生变化时,并不一定需要立刻响应,在具体场景中需要根据实际需求来选择使用oninput还是onchange。

相关文章
|
5月前
|
JavaScript 前端开发
点击事件中的this|click事件与change事件|v-model
点击事件中的this|click事件与change事件|v-model
36 0
|
5月前
|
流计算
oninput和onchange事件的区别是什么
oninput和onchange事件的区别是什么
|
5月前
|
JavaScript 前端开发
JS中oninput和onchange事件的区别
JS中oninput和onchange事件的区别
|
2月前
oninput和onchange事件有什么区别?
oninput和onchange事件有什么区别? 最新推荐文章于 2024-08-14 15:45:18 发布
62 0
|
5月前
|
JavaScript 前端开发
oninput 和 onchange 事件的区别
oninput 和 onchange 事件的区别
53 9
|
5月前
|
JavaScript 前端开发 流计算
JS:oninput和onchange事件的区别
JS:oninput和onchange事件的区别
105 1
|
5月前
|
JavaScript
oninput 和 onchange 事件有什么区别
oninput 和 onchange 事件有什么区别
|
11月前
|
流计算
oninput和onchange事件有什么区别
oninput和onchange事件有什么区别
62 0
|
JSON 数据格式
onchange事件
onchange事件
57 0
|
JavaScript 程序员
【JavaScript-事件】target和this的区别?如何阻止冒泡事件?常见的鼠标事件和键盘事件有哪些?
【JavaScript-事件】target和this的区别?如何阻止冒泡事件?常见的鼠标事件和键盘事件有哪些?
156 0
【JavaScript-事件】target和this的区别?如何阻止冒泡事件?常见的鼠标事件和键盘事件有哪些?