триггер или возврат Shift + Tab в JavaScript или JQuery - PullRequest
Новая
       42

триггер или возврат Shift + Tab в JavaScript или JQuery

1 голос
/ 15 февраля 2012

Я сделал страницу для Windows CE с двухмерной навигацией, используя tabIndex. сначала я просто хотел использовать tabIndex в качестве ссылки для следующего фокуса.

, поскольку это приложение для портативного устройства, выполнение его таким образом очень затратно для портативного устройства и отнимает много времени по сравнению с простой вкладкой и клавишами Shift + Tab.

У меня есть функция для обработки onkeydown для моей стрелки вверх и вниз, для моего downarrow, код прост

if(specialMove == 0){ все, что он делает, это проверяет, что вкладка не покидает страницу.

event.keyCode=9; return;}

проблема в том, что я иду вверх, я хочу, чтобы он возвращал SHIFT + TAB для навигации вверх, я нашел этот фрагмент кода jQuery, но у меня возникают проблемы с его работой. 

if(specialMove == 0){
    $('body').trigger(JQuery.Event('keydown', {keyCode:9, shiftKey: true}));
    return;
}

1 Ответ

1 голос
/ 15 февраля 2012

В этом случае триггер вызывает только те обработчики событий, которые определены в теле. Он не отправляет коды клавиш в браузер. См .: http://api.jquery.com/trigger/. Короче говоря, он выполняет только тот код, который известен jQuery, который будет выполнен в случае события keydown. «Имитирует» событие нажатия клавиш.

Насколько я знаю, отправка ключевых событий в браузер невозможна, так как это создает серьезные риски для безопасности. Вам нужно будет реализовать выбор следующего и предыдущего элемента в Javascript.

EDIT: Вы можете попробовать что-то вроде: 

$(function() {
  var navigationElements = $('[tabIndex]').sort(function(a,b) {
    return $(a).attr('tabindex') - $(b).attr('tabindex');
  });

  // We don't know if the users presses the up or down button first
  // so we initialize as null and let the event handle the first element
  var currentIndex = null;

  // On event:
  if (currentIndex != null && currentIndex < navigationElements.length - 1) {
    navigationElements[++currentIndex].focus();
  } else {
    currentIndex = 0;
    navigationElements[currentIndex].focus();
  }

  // and:
  if (currentIndex != null && currentIndex > 0) {
    navigationElements[--currentIndex].focus();
  } else {
    currentIndex = navigationElements.length - 1;
    navigationElements[currentIndex].focus();
  }
});

Это непроверенный, неоптимизированный код, так что, вероятно, есть гораздо лучшее решение, но оно будет работать довольно быстро даже в медленных браузерах. Он не учитывает изменения фокуса, которые не проходят через ваши события, поэтому вам нужно добавить onfocus события, чтобы установить currentIndex для элемента, который был последний раз выбран пользователем.

...