Javascript - Удаление пробелов в пасте

У меня есть текстовое поле ввода с максимальной длиной 10. Поле предназначено для австралийских телефонных номеров (10 цифр). Телефонные номера обычно разделяются на следующий синтаксис

12 12345678

Если кто-то копирует вышеуказанное и вставляет его в поле ввода, он, очевидно, оставляет последнюю цифру и сохраняет пробел.

Есть ли способ удалить все пробелы прямо перед вставкой в ​​поле ввода? Или есть другая работа вокруг?

Спасибо заранее.

Ответ 1

Это должно сработать для вас:

HTML

<input type="text" id="phone" maxlength="10" />​

JavaScript

var phone = document.getElementById('phone'),
    cleanPhoneNumber;

cleanPhoneNumber= function(e) {
    e.preventDefault();
    var pastedText = '';
    if (window.clipboardData && window.clipboardData.getData) { // IE
        pastedText = window.clipboardData.getData('Text');
      } else if (e.clipboardData && e.clipboardData.getData) {
        pastedText = e.clipboardData.getData('text/plain');
      }
    this.value = pastedText.replace(/\D/g, '');
};

phone.onpaste = cleanPhoneNumber;

Fiddle: http://jsfiddle.net/y6TYp/6/

Обновление. nnnnnn отлично поработал с австралийскими телефонными номерами, обновив замену regex.

Ответ 3

Приступая к описанной вами задаче, вы хотите убедиться, что ваш код работает в разных браузерах с или без javascript, поэтому я бы сделал следующее:

  • Установите максимальную длину в 11 - maxlength является атрибутом HTML, и вам нужно убедиться, что с или без javascript данные, введенные пользователем, не будут потеряны. Если пользователь вводит 11 цифр и нет javascript - вам нужно будет захватить данные и очистить их со стороны сервера. Ну, проверка на стороне сервера является обязательной.

  • Если javascript существует, я бы использовал функцию jquery, чтобы установить maxlength и убедиться, что пробелы удалены, поэтому скажите, что у вас есть поле с идентификатором = 'title': на документе вы готовы написать следующий код

    $( '# ввода заголовка') Attr ( 'MaxLength', '10') нажатие клавиши (limitMe);..

    function limitMe(e) {
        if (e.keyCode == 32) { return true; }
        return this.value.length < $(this).attr("maxLength");
    }
    

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

$('input.limited').attr('maxLength','10').keypress(limitMe);