English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Реализация метода для определения, кликали ли по тегу input или другим тегам на странице в Chrome

Функция, которую нужно реализовать: при потере фокуса input-окна и клике не на кнопку очистки, выполнить метод reset для сброса стиля input, при клике на кнопку очистки выполнить метод clear для удаления содержимого input.

如图

Я хотел реализовать это следующим образом

$(".search-input").focusout(function () {
          if (document.activeElement.className !== 'close-t') { // close-t это класс кнопки-clear
            $('.search-input').addClass('search-before');
            $('.close').css('display', 'none');
            document.getElementById('search').value = '';
          }
});

Кроме того, при потере фокуса у input, первым элементом, на котором появляется фокус, является элемент body, поэтому该方法 не работает, в конечном итоге была использована следующая строка кода для реализации этой функции

$("#search").focusout(function () {
  //Определение, был ли произведен клик по кнопке-clear после потери фокуса, если да, то не сбрасывать
  var tapCloseButton = false;
  $('.close-t').focus(function () {
    tapCloseButton = true;
  });
  setTimeout(function () {
    if (!tapCloseButton) {
      $('.search-input').addClass('search-before');
      $('.close').css('display', 'none');
      document.getElementById('search').value = '';
    }
  },10);
});

Этап определения фокуса отложен, поэтому в этот момент фокус уже переместился с body на истинный элемент, на котором был произведен клик, и в этот момент производится определение фокуса, чтобы увидеть, является ли это клавишей-clear.

Данная статья о методе определения, на каком из элементов input или на другом элементе была произведена клик в Chrome, является полным содержанием, которое я хочу предложить вам в качестве参考а, также希望大家多多支持呐喊教程。

Основной учебник
Рекомендуем также