Удалите Safari/Chrome textinput/textarea свечение

Вместо этого вы можете использовать делегат слушателя:

document.addEventListener('click', e => {
  if (e.target.matches('.book-now') {
    // declare variables
    // send Ajax request
    // etc.
  }
})

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

let bookNowBtn = document.querySelector(".book-now"); 
if (bookNowBtn) { 
  bookNowBtn.addEventListener('click', e => { /*...*/ }) 
}
325
задан Michael Irigoyen 19 February 2014 в 04:38
поделиться

3 ответа

textarea, select, input, button { outline: none; }

Хотя утверждалось, что сохранение свечения / контура на самом деле полезно для доступности, поскольку это может помочь пользователям увидеть, какой элемент в данный момент находится в фокусе.

Вы также можете использовать псевдоэлемент ' : focus 'для таргетинга на входы только тогда, когда пользователь их выбрал.

Демо: https://jsfiddle.net/JohnnyWalkerDesign/xm3zu0cf/

603
ответ дан 23 November 2019 в 00:51
поделиться

Это решение работало на меня.

input:focus {
    outline: none !important;
    box-shadow: none !important;
}
1
ответ дан 23 November 2019 в 00:51
поделиться

При изменении размера текстового поля в браузерах на основе webkit:

Установка max-height и max-width для текстового поля не удаляет визуальный дескриптор изменения размера. Попробуйте:

resize: none;

(и да, я согласен с «старайтесь не делать ничего, что нарушает ожидания пользователя», но иногда это имеет смысл, например, в контексте веб-приложения)

Чтобы настроить внешний вид webkit формирует элементы с нуля:

-webkit-appearance: none;
13
ответ дан 23 November 2019 в 00:51
поделиться
Другие вопросы по тегам:

Похожие вопросы: