Я пытаюсь сделать аккордеоны на нашем сайте доступными, добавив поддержку управления с клавиатуры. Мне нужно, чтобы клавиша ввода или клавиша пробела вызывали открытие / закрытие аккордеонов. Аккордеоны состоят из элементов div и span.
Я пытался адаптировать текущий код js, который работает для клика, с нашими аккордеонами, но не могу заставить его работать.
Вот пример HTML для одного элемента аккордеона на нашем сайте:
`
Свадьбы, частные мероприятия и аренда помещений
Заголовок для свадеб
Содержимое свадебного проката
`
Вот js, который работает для события click:
$('.accordion .title').click(function() {
$(this).parent().children('.content').toggle();
$(this).toggleClass('open');
if ($(this).hasClass('open')){
$(this).parent().attr("aria-expanded","true");
}else {
$(this).parent().attr("aria-expanded","false");
}
});
Ниже приведено то, что я пытался воспроизвести для нажатия клавиши «Ввод», это не работает. Ничего не произошло.
`$('.accordion .title').keypress(function(e) {
if (e.which == 13) {
$('.accordion .title').click();
}
});`
Когда я изменяю этот код, чтобы указать селектор jquery на один отдельный узел аккордеона (с идентификатором в селекторе, например, $ ('# trigWeddings')), код работает, но открывает все узлы аккордеона на странице. что, очевидно, не то, что я хочу.
Я не совсем понимаю, что я на самом деле здесь делаю, добавляю ли я прослушиватель событий, и если нет, то нужно ли это делать? Как я могу вызвать то, что уже существует для события нажатия для нажатия клавиши Enter или пробела?