Удалите все пробелы при вводе в текстовое поле на веб-странице

Question

Как я могу на лету удалить пробелы, введенные в текстовое поле, пока человек печатает?

Answer 1

$(function() {
  var txt = $("#myTextbox");
  var func = function() {
    txt.val(txt.val().replace(/\s/g, ''));
  }
  txt.keyup(func).blur(func);
});

Вам необходимо дополнительно обработать событие blur, поскольку пользователь может использовать контекстное меню для вставки;)

Answer 2

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

// Modified roosteronacid's example to consider all whitespace characters
function sanitizer(s) {
    var a = s.split(""),
        i = a.length,
        r = "";

    while (i) {
        i--;
        if (a[i] !== " " || a[i] !== "\t" || a[i] !== "\r" || a[i] !== "\n" || a[i] !== "\f" || a[i] !== "\v") {
            r += a[i];
        }
    }

    return r;
}

// Regular expression method wrapped in a function to incur the same overhead
function regexp(s) {
  return s.replace(/\s+/g, '');
}

var iterations = 10000;
// 1024 characters or good meausure
var text = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris luctus tristique ante, ac suscipit tortor consequat at. Fusce id tortor quis felis faucibus dignissim. Pellentesque viverra pellentesque eros, ac sagittis quam cursus a. Nullam commodo mauris eget nisi luctus vitae ultricies leo volutpat. Morbi quis quam id elit accumsan semper. Praesent aliquam aliquam tortor vel vulputate. Nulla adipiscing ipsum vitae est luctus imperdiet. Suspendisse potenti. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus at urna ut leo ornare commodo. Quisque eros dolor, adipiscing quis malesuada quis, molestie nec lectus. Quisque et odio nibh. Integer mattis tincidunt ligula, eu scelerisque erat posuere non. Sed ipsum quam, fringilla id porttitor ac, placerat quis nunc. Praesent sodales euismod ultricies. In porta magna metus. Morbi risus risus, hendrerit sit amet ultrices eu, interdum placerat massa. Nunc at leo dui. Morbi eu nunc mi, at ullamcorper felis. Duis et metus metus. ";

var s = new Date();
for ( var i=0; i<iterations; ++i ) {
  sanitizer(text);
}

console.log((new Date()).getTime() - s.getTime());

var s = new Date();
for ( var i=0; i<iterations; ++i ) {
  regexp(text);
}

console.log((new Date()).getTime() - s.getTime());

Результаты 8 казней:

# Initial times
sanitizer: 5137, 8927, 8817, 5136, 8927, 5132, 8807, 8804
regexp:    1275, 1271, 1480, 1278, 1274, 1308, 1270, 1270

# Dropped highest and lowest values
sanitizer: 5137, 8817, 5136, 8927, 8807, 8804
regexp:    1275, 1271, 1278, 1274, 1308, 1270

# Averages
sanitizer: (5137 + 8817 + 5136 + 8927 + 8807 + 8804) / 6 = 7604.66667
regexp:    (1275 + 1271 + 1278 + 1274 + 1308 + 1270) / 6 = 1279.33333

Оказывается, использование регулярных выражений на 594% быстрее.

См. Ответ Джоша Стодола о реализации.

Редактировать: Я заметил, что метод roosteronacid изменился; однако использование r в качестве массива делает его еще медленнее.

Answer 3

Я использую следующий код:

<input type="text" onkeyup="fixme(this)" onblur="fixme(this)"/>

function fixme(element) {
 var val = element.value;
 var pattern = new RegExp('[ ]+', 'g');
 val = val.replace(pattern, '');
 element.value = val;
} 

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

var pattern = new RegExp('[^0-9]+', 'g'); 

Answer 4

Вы можете попробовать это так:

$("input").keypress(function (e) {
   $(this).val($(this).val().replace(' ',''));
}

Answer 5

на лету? Возможно, при каждом событии нажатия клавиши введите строку в текстовое поле

$('#id').val($.trim($('#id').val());  

Это удалит все посторонние места спереди и сзади.