Предотвращения возврата от перехода обратно на AngularJS

Я столкнулся с этой проблемой в моем AngularJS webapp.

Когда пользователь входит на страницу с формой для заполнения и начинает печатать, если он нажимает клавишу backspace и фокус не находится на вводимом тексте, то страница переходит в предыдущее состояние.

Я искал это решение с помощью jQuery, но это не кажется подходящим способом для достижения этого в AngularJS.

4 7
javascript angularjs jquery backspace

4 ответа:

Существует $document в угловой js: 

angular.module('yourModule', [])
  .controller('yourController', ['$scope', '$document', function($scope, $document) {
      $document.on('keydown', function(e){
          if(e.which === 8 && ( e.target.nodeName !== "INPUT" && e.target.nodeName !== "SELECT" ) ){ // you can add others here inside brackets.
              e.preventDefault();
          }
      });

    }
  ]);

Демонстрация Plnkr.

Вы можете видеть в демо-версии, которую я использовал только для "INPUT" nodeName, и это не мешает использовать ключ backspace по умолчанию для ввода текста, но не для textarea, потому что мы не обрабатывали его в условии.

9

Я не могу комментировать "принятый ответ", но он будет работать неправильно, как условие 

e.which === 8 && e.target.nodeName !== "INPUT" || e.target.nodeName !== "SELECT"

С логической ошибкой, поэтому вы можете использовать

e.which === 8 && e.target.nodeName !== "INPUT" && e.target.nodeName !== "SELECT"

Или ответ, который написал @ThisIsMarkSantiago.

9

Добавьте следующий скрипт в свой контроллер

var rx = /INPUT|SELECT|TEXTAREA/i;

$document.on("keydown keypress", function(e){
    if( e.which == 8 ){ // 8 == backspace
        if(!rx.test(e.target.tagName) || e.target.disabled || e.target.readOnly ){
            e.preventDefault();
        }
    }
});

Или вы можете использовать Jquery 

  $(function(){
      var regx = /INPUT|SELECT|TEXTAREA/i;

      $(document).bind("keydown keypress", function(e){
          if( e.which == 8 ){ // 8 == backspace
              if(!regx.test(e.target.tagName) || e.target.disabled || e.target.readOnly ){
                  e.preventDefault();
              }
          }
      });
  });
1

Я получил этот ответ здесь: Как отключить нажатие клавиши backspace во всех браузерах? 

$(document).keydown(function(e) {
    var nodeName = e.target.nodeName.toLowerCase();

    if (e.which === 8) {
        if ((nodeName === 'input' && e.target.type === 'text') ||
            nodeName === 'textarea') {
            // do nothing
        } else {
            e.preventDefault();
        }
    }
});

Просто поместите его в свой контроллер.

0