Как я могу получить события нажатия клавиш в div в Chrome?

#jquery #keydown

#jquery #нажатие клавиш

Вопрос:

Я хотел бы получить события нажатия клавиш в div. Я использую jQuery keydown. Довольно просто.

Однако в Chrome это не работает. Чтобы это работало в Chrome, я должен установить tabindex = 0.

Если я сделаю это, Chrome поместит уродливую оранжевую рамку вокруг моего div.

Есть ли способ заставить это работать в Chrome без уродливой оранжевой рамки?

1. Я спрашиваю, куда вы идете правильным путем с этим. Чтобы иметь keydown событие, вам теоретически нужно сосредоточиться на вашем элементе, иначе на чем вы нажимаете клавишу?

2. Как может быть событие нажатия клавиш в div??? Я думал, что только текстовые вводы и текстовые области могут быть отключены

Ответ №1:

Событие Keydown отправляется только элементу HTML, который находится в фокусе. Фокусируемые элементы различаются в разных браузерах, но элементы, для которых установлено свойство tabindex, всегда могут фокусироваться в большинстве браузеров.

Вы уже установили tabindex для элемента div, чтобы он мог фокусироваться и получать событие клавиатуры. Ваша проблема заключается в контуре текущего элемента по умолчанию в Google Chrome.

Чтобы изменить контур («уродливую оранжевую рамку», как вы упомянули), используйте псевдокласс CSS: фокус и контур свойства CSS. Следующий пример удалит контур из всех элементов, когда они будут в фокусе:

 *:focus
{
    outline: none;
}

Надеюсь, это поможет.