Focusout 事件在输入事件 jQuery 中的第一次激活时不起作用

Question

我有一个输入和 focus 事件。当它聚焦时，使父 div 变大，当它不聚焦时，使其变小，但我在输入事件中有 focusout 事件，以确保它是否为空。但是当你聚焦输入、输入内容、删除它然后点击离开该输入（focusout）时它工作得很好并且它按照我想要的方式工作。刷新站点后它会停止工作，因为它 "forgets" 是您在那里输入并删除的。这是 jsfiddle，我想我不必 post 那 code, 当一切都在那里时 -> https://jsfiddle.net/rnotx7rg/

Answer 1

如果我明白你的问题是什么，我认为你不需要输入事件，但你只需要在 focusout 事件上检查输入字段是否为空。

这是 JS 部分：

$('.emailLog').focus(function() {
  $('.emailLogdiv').css({
    'height': '50px'
 });
   $('.emailLogLabel').css({
    'bottom': '50px',
    'font-size': '1.1em'
 });
 $('.emailLog').css({
    'color': 'black'
  });
});

$('.emailLog').focusout(function() {

  if ($(this).val() === '') {

$('.emailLogdiv').css({
  'height': '6px'
});
$('.emailLog').css({
  'color': '#656565'
});
$('.emailLogLabel').css({
  'bottom': '5px',
  'font-size': '1.5em'
});

 } else {

$('.emailLogdiv').css({
  'height': '50px'
});
$('.emailLog').css({
  'color': 'black'
});
$('.emailLogLabel').css({
  'bottom': '50px',
  'font-size': '1.1em'
});

  }

});

这是更新后的 jsfiddle

Focusout 事件在输入事件 jQuery 中的第一次激活时不起作用

Focusout event doesn't work on 1st activation in on input event jQuery

html

css

jquery

focus

focusout