js 文本框内容改变事件

在JavaScript中,文本框内容改变事件可以使用 oninput onchange 来实现。

oninput 事件在输入框的值发生改变时立即触发,不需要等待用户输入完成。它可以用来实时监测用户输入内容的变化,比如实时搜索。

onchange 事件则需要等到用户完成输入并且焦点移出输入框后才会触发。这个事件适用于需要用户输入完整数据后才执行的操作。

以下是使用 oninput onchange 的示例代码:

<!-- 使用 oninput -->
<input type="text" oninput="myFunction()">
<script>
function myFunction() {
  // 获取输入框的值
  var input = document.querySelector('input[type="text"]').value;
  console.log(input);
</script>
<!-- 使用 onchange -->
<input type="text" onchange="myFunction()">
<script>
function myFunction() {
  // 获取输入框的值
  var input = document.querySelector('input[type="text"]').value;
  console.log(input);
</script>

以上代码将会在控制台中输出输入框的值。

  •