Make + key act like Tab в форме с помощью AngularJS

Question

Я работаю над веб-приложением, используя AngularJS.

Внутри формы клиент хочет, чтобы клавиша + работала как клавиша Tab. Форма содержит статические текстовые входы, ввод и кнопки. Он также будет содержать динамически добавленные текстовые входы, которые добавляются с помощью ng-repeat.

Я думал, что смогу сделать это, захватив событие нажатия клавиши и сменив код ключа, но это не работает.

Любые идеи?

Answer 1

Я понял, как это решить, используя угловую директиву. Поместите эту директиву на элемент. Внутри этого элемента он добавит прослушиватель нажатия клавиш ко всем входам и кнопкам; он даже обрабатывает динамически добавленные элементы!

app.directive('nspPlusAsTab', function() { 
    function getNextTabbableElement(indexOfCurrentElement, tabbableElements) { 
    var indexOfNextTabbableElement; 
    var lastIndexInTabbableElements = tabbableElements.length - 1; 

    if (indexOfCurrentElement === lastIndexInTabbableElements) { 
     indexOfNextTabbableElement = 0; 
    } else { 
     indexOfNextTabbableElement = indexOfCurrentElement + 1; 
    } 

    var nextTabbableElement = tabbableElements[indexOfNextTabbableElement]; 

    if (nextTabbableElement.disabled) { 
     nextTabbableElement = getNextTabbableElement(indexOfNextTabbableElement, tabbableElements); 
    } 

    return nextTabbableElement; 
    } 

    return { 
    restrict: 'A', 
    link: function(scope, element) { 
     //use jQuery.on to attach a keypress event handler function to all current and future input or button elements 
     element.on("keypress", "input, button", function(event) { 
     var plusKeycode = 43; 

     if (event.which === plusKeycode) { 
      event.stopPropagation(); 
      event.preventDefault(); 

      var tabbableElements = element.find("input, button"); 
      var indexOfCurrentElement = tabbableElements.index(this); 
      var nextTabbableElement = getNextTabbableElement(indexOfCurrentElement, tabbableElements); 
      nextTabbableElement.focus(); 
     } 
     }); 

    element.on("focus", "input", function(){ 
     this.select(); 
    }); 
    } 
    }; 
}); 

Answer 2

Вам нужно будет захватить событие нажатия клавиши, подавить его (остановить распространение, предотвратить по умолчанию), а затем отправить новое настраиваемое событие нажатия клавиши.