Альтернатива jQuery для document.activeElement

Что я хотел сделать, так это выяснить, когда пользователь связан с элементом INPUT или TEXTAREA, и установить для флага переменной значение true... и установить для этого флага значение false сразу после того, как пользователь больше не взаимодействует с ними (т. Е. Они '). мы щелкнули из элементов INPUT/TEXTAREA).

Я использовал функцию docuemnt.ready в jQuery, чтобы добавить атрибут onclick к своему элементу body и назначить его моей функции getActive().

Код для функции getActive() выглядит следующим образом:

функция getActive()
{
  activeObj = document.activeElement;
  var inFocus = false;
  if (activeObj.tagName == "INPUT" || activeObj.tagName == "TEXTAREA")
  {
     inFocus = true;
  }
}

Я действительно хотел бы продолжить работу с фреймворком jQuery, но не могу найти способ реализовать ту же логику, описанную выше, с использованием синтаксиса JUST JQuery.

5 ответов

Решение

Вы хотите, чтобы фокус и размытие обработчиков событий. Например...

var inFocus = false;
$('input, textarea').focus(function() {
  inFocus = true;
});

$('input, textarea').blur(function() {
  inFocus = false;
});

Я почти уверен, что запятая даст вам ввод ИЛИ текстовую область, но вы поймете, если это не сработает

function getActive(){
   return $(document.activeElement).is('input') || $(document.activeElement).is('textarea');
}

Для первоначального вопроса о том, чтобы выяснить, является ли в настоящее время сфокусированным элементом какой-либо из этих элементов пользовательского ввода, должно работать ниже:

function isInputElementInFocus() {
    return $(document.activeElement).is(":input");
}

Концептуально мне не нравится этот подход для общего случая, когда вы слушаете глобальные события (например, нажатия клавиш) и пытаетесь решить, должны ли они обрабатываться вашим глобальным обработчиком или игнорироваться, потому что он предназначен для кого-то другого. Причина, по которой мне это не нравится, потому что это небезопасно в будущем, а также кто знает, чем еще может быть кто-то, кроме элементов ввода.

Еще одна более надежная, но сложная для реализации идея - проверить, предназначено ли событие для элемента, у которого tabIndex >= 0. По умолчанию для элементов ввода установлено значение tabIndex === 0, поэтому оно становится более или менее похожим на описанный выше подход. Вы можете легко проверить это, event.target.tabIndex >= 0 без необходимости полагаться на document.activeElement,

Здесь есть один недостаток (если вы хотите быть универсальным): вам также необходимо убедиться, что элемент event.target не находится ни в одной ветви в иерархии DOM, ни между кем-то между event.currentTarget и event.target есть tabIndex >= 0, Вы поняли: это может стать мутным, но я просто подумал записать это, если кому-то еще нужно общее решение.

Вы можете сделать что-то вроде этого:

var focusItem = null; 
$('input, textarea').focus( function() { 
    focusItem = this; 
});

Это .blur() событие, что вы ищете?

Другие вопросы по тегам