Клавиша возврата не работает после нажатия кнопки ОК - PullRequest
0 голосов
/ 19 октября 2018

Я написал ниже строки кода

$(".only-numbers").keypress(function(e) {
  if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
    swal({
      title: "Warning",
      type: "warning",
      text: "Please enter Numbers only"
    });

    return false;
  } else {
    return true;
  }
});

$("#driver_contact_number").on("keyup keydown change", function(event) {
  var max_chars = 12;
  if ($(this).val().length >= max_chars) {

    swal({
      title: "Warning",
      type: "warning",
      text: "Number should not exceed 12 digits"
    });


    $(this).val($(this).val().substr(0, max_chars));
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.0/sweetalert.min.js"></script>
<input id="driver_contact_number" class="only-numbers">

Всякий раз, когда пользователь вводит больше 12 цифр, отображается предупреждение о swal, но после нажатия кнопки ok всплывающего окна swal, затем, когда мы нажимаем backspace, это делаетне работа.Пожалуйста, помогите !!!

Ответы [ 3 ]

0 голосов
/ 19 октября 2018

1) Вы должны проверить keyCode (del, backspace) перед отображением предупреждающего сообщения.

if (event.which != 8 && event.which != 46  && $(this).val().length >= max_chars)

2) Вы должны сосредоточить свой ввод на событии закрытия swal.

         $(".only-numbers").keypress(function(e){
                    if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) 
                    {
                        swal({
                        title: "Warning",
                        type: "warning",
                        text: "Please enter Numbers only"
                        }).then(function() {
      										$(e.target).focus();
    										});

                         return false;
                    }
                    else
                    {
                        return true;
                    }
               }); 

         $("#driver_contact_number").on("keyup keydown change", function (event) {
            var max_chars = 12;
               if (event.which != 13 && event.which != 8 && event.which != 46  && $(this).val().length >= max_chars) { 

                    swal({
                        title: "Warning",
                        type: "warning",
                        text: "Number should not exceed 12 digits"
                     }).then(function() {
      									$(event.target).focus();
    								 });


                 $(this).val($(this).val().substr(0, max_chars));
               }
          });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>

<input id ="driver_contact_number" class="only-numbers">
0 голосов
/ 19 октября 2018

После того, как вы отклоните предупреждение, вы можете использовать обещание, чтобы сосредоточиться назад, откуда вы пришли.

Другие изменения:

  • Я не знаю, почему у вас было другое, но я удалил его как ненужный.
  • у вас устарела typeпоэтому я изменил его на icon
  • Ваша функция длины имела>>, но должна быть>, что вызывало проблему с backspace

$(".only-numbers").on('keypress', function(e) {
  if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
    swal({
      title: "Warning",
      icon: "warning",
      text: "Please enter Numbers only"
    }).then(function() {
      $(e.target).focus();
    });
    return false;
  }
  return true;
});

$("#driver_contact_number").on("keyup keydown change", function(event) {
  var max_chars = 12;
  if ($(this).val().length > max_chars) {
    swal({
      title: "Warning",
      icon: "warning",
      text: "Number should not exceed 12 digits"
    }).then(function() {
      $(event.target).focus();
    });
    $(this).val($(this).val().substr(0, max_chars));
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.0/sweetalert.min.js"></script>
<input id="driver_contact_number" class="only-numbers">
0 голосов
/ 19 октября 2018

Трудно сказать точно без рабочего примера, но я бы сказал, что когда вы нажимаете кнопку "ОК" в оповещении, ваш ввод больше не фокусируется, поэтому возврат не работает.

Возможно, вы могли бы исправить это, установив фокус на ввод после нажатия кнопки «ОК» (в документации есть несколько методов, таких как swal.DismissReason.close: https://sweetalert2.github.io/#handling-dismissals)

...