blur event.relatedTarget retorna nulo
eu tenho um<input type="text">
e preciso desmarcá-lo quando esse campo perder o foco (o que significa que o usuário clicou em algum lugar da página). Mas há uma exceção. O campo de texto de entrada não deve ser limpo quando o usuário clicar em um elemento específico.
Eu tentei usarevent.relatedTarget
para detectar se o usuário clicou não apenas em algum lugar, mas no meu específico<div>
.
No entanto, como você pode ver no snippet abaixo, ele simplesmente não funciona.event.relatedTarget
está sempre retornandonull
!
function lose_focus(event) {
if(event.relatedTarget === null) {
document.getElementById('text-field').value = '';
}
}
.special {
width: 200px;
height: 100px;
background: #ccc;
border: 1px solid #000;
margin: 25px 0;
padding: 15px;
}
.special:hover {
cursor: pointer;
}
<input id="text-field" type="text" onblur="lose_focus(event)" placeholder="Type something...">
<div class="special">Clicking here should not cause clearing!</div>