Почему использование фокусировки с jQuery работает для Firefox, а использование addEventListener - нет?

Question

Я прочитал в MDN, что focusout не работает на Firefox, но зачем использовать его с jQuery. Что такое колдовство за jQuery? Благодарю.

скрипка

$(".input1").on("focusout", function() {
    console.log("jquery focusout");
});

document.querySelector(".input2").addEventListener("focusout",  function(){
 console.log("focusout");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<input class="input1" type="text" />
<input class="input2" type="text" />

Answer 1

JQuery обходит эту проблему с помощью стандартного focus а также blur события и установка аргумента фазы захвата для addEventListener,

Вот соответствующий исходный файл.

В вашем примере вы можете заменить:

document.querySelector(".input2").addEventListener("focusout",  function(){
    console.log("focusout");
});

С:

document.querySelector(".input2").addEventListener("blur",  function(){
    console.log("focusout");
}, true);

JSFiddle

$(".input1").on("focusout", function() {
    console.log("jquery focusout");
});

document.querySelector(".input2").addEventListener("blur",  function(){
    console.log("focusout");
}, true);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<input class="input1" type="text" />
<input class="input2" type="text" />

Answer 2

Потому что это не поддерживается в Firefox, и jQuery имеет обходной путь для этого (в основном, переводя его в blur слушатель событий).