Разница между фокусом/фокусом и фокусом/размытием, с примером

Ответ 1

В пузырьках событий focusin и focusout события focus и blur отсутствуют. Это означает, что вы можете использовать focusin и focusout в родительском элементе поля формы.

Демо: http://jsfiddle.net/pAp4E/

HTML:

<div class="parent">
    <input type="text" />
</div>

<div class="log"></div>

JavaScript:

$('.parent')
    .focusin(function(){log('div focusin');})
    .focusout(function(){log('div focusout');})
    .focus(function(){log('div focus');})
    .blur(function(){log('div blur');});
$('input')
    .focusin(function(){log('input focusin');})
    .focusout(function(){log('input focusout');})
    .focus(function(){log('input focus');})
    .blur(function(){log('input blur');});

function log(str){
  $('.log').append($('<div/>').text(str));
}

Когда вы запустите его, вы увидите, что только вход получает все события, родительский получает события focusin и focusout.

Ответ 2

События фокуса и размытия отслеживают элементы, на которые пользователь фокусируется.

• фокус

  Вызывается, когда фокусируемый элемент получает фокус

• Размытие

  Вызывается, когда фокусируемый элемент теряет фокус

• focusin и focusout

  Пожар в то же время, что и фокус и размытие, но пузырь.

например проверьте это