Символы, вводимые в поле ввода - PullRequest
Новая
       15

Символы, вводимые в поле ввода

0 голосов
/ 13 июня 2019

Я уверен, что это что-то действительно глупое, что мне не хватает.

Я пишу небольшой фрагмент, который добавляет дефис к строке, извлеченной из поля ввода.Дефис добавляется только после того, как мы достигли позиции 4, поэтому я могу набрать 123, и дефис не появится.Если я наберу 1234, он автоматически изменится на 1234-.Проблема заключается в обработке вставки, где-то внизу строки внутри jQuery (после того, как мой код был выполнен), он вводит больше символов в поле.

Мой подход достаточно прост.Я смотрю на события keyup и keydown, проверяю ввод и вставляю дефис.Для вставки я смотрю даже на вставку, беру строку, разделяю ее и вставляю дефис в зависимости от того, присутствует он или нет. 

$('[id$="field"]').on('paste', function (event) {
    var element = this;
    var text = event.originalEvent.clipboardData.getData('text').split('');

    if (text.length > 4 && text.indexOf('-') < 0) {
        text.splice(4, 0, '-');
        $(element).val(text.join(''));
    }
});

$('[id$="field"]').bind('keyup keydown', function (event) {
    var input = $(this).val();

    if (input.length === 4 && event.keyCode !== 8) {
        $($(this).val(input + '-'));
    }
});

Слушатель keyup и keydown работает просто отлично.Если я вставлю 12345, у меня получится 1234-5, когда я нажму $(element).val(text.join(''));, но после этого появится дополнительный символ, пока jQuery делает свое дело.

Я довольно озадачен.

Любойидеи?

1 Ответ

2 голосов
/ 13 июня 2019

Поскольку вы переопределяете типичное поведение «вставки» путем непосредственного обновления значения поля ввода, вам необходимо предотвратить поведение вставки «по умолчанию». 

$('[id$="field"]').on('paste', function (event) {
    event.preventDefault();
    // ...
...