当键入光标离开输入文本字段时如何触发功能？

Question

我想在键入光标离开输入文本字段时触发一个功能。是否存在这样的事件？如果有人知道，请让我知道，谢谢。

// to trigger this function
function trigger () {
    console.log("no longer able to type in input text);
}

Answer 1

只需使用onblur。您可以在vanilla js和jquery中执行此操作。

香草Js：

function test() {
  alert('Exited');
}

document.getElementById('waffle').addEventListener('blur', function(){
  alert('exited waffle');
});

<input type="text" onblur="test()">
<input type="text" id="waffle">

使用JQuery：

$('#test').on('blur', function(){
  alert('exited');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="test" type="text">

jQuery Ref：https://api.jquery.com/blur/

香草：https://developer.mozilla.org/en-US/docs/Web/Events/blur

Answer 2

是的，有一个事件可以将一个函数绑定到称为“模糊”的事件。如果您使用addEventListener()，则看起来像这样：

document.getElementById("myInput").addEventListener("blur", function() {
    alert("focused out");
});

<input id="myInput"/>

或者，如果您有一个命名函数myFunction，则可以通过输入标签在DOM元素上注册它：

function myFunction() {
    alert("focused out");
};

<input onblur="myFunction()"/>