Оставляйте пробел только в середине имени и фамилии

Question

Пытаясь найти решение проблемы, с которой мы столкнулись.

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

Мы можем сделать это в начале с помощью следующего кода, однако мы не можем понять, как применить это к концу, оставляя при этом пробел в середине.

    $(function() {
    $('body').on('keydown', '#test', function(e) {
     console.log(this.value);
    if (e.which === 32 &&  e.target.selectionStart === 0) {
     return false;
     }  
     });
     });

1008 * Разрешено *

"Боб Смит"

Не разрешено

"Боб Смит"

"Боб Смит"

"Боб Смит"

Answer 1

Для этого случая вам нужны регулярные выражения. Я думаю, что следующее поможет (вы можете найти лучший вариант).

Если вам нужно избавиться от пробелов до и после ввода, вы можете использовать trim().

function isCorrect(input) {

  const regex = /^[A-Za-z]* [A-Za-z]*$/i;

  if (input.match(regex)) {
    return true;
  } else {
    return false;
  }
}

const strs = [
  "John Doi",
  "Helen  J",
  " One more",
  "Singlename",
  "Jake Cham "
];

function test() {
  const body = document.querySelector('body');
  strs.forEach((e, i, arr)=> {
    const li = document.createElement('p');
    li.innerText = `Element #${i} - ${isCorrect(e)}`;
    body.appendChild(li);
  });
}

window.onload = () => {
  test();
  console.log('document loaded');
};

Answer 2

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

https://jsfiddle.net/ibowankenobi/0tvvpezt/2/

document.getElementsByTagName("input")[0].addEventListener("keydown",function(e){
     var cT = e.currentTarget,
         temp;
     cT.value = (temp = cT.value.match(/\w+(?:\s+)?(?:\w+)?/gi), temp && temp[0] || "");
},false)

Я позволил несколько пробелов между именем и фамилией специально изменить его, если хотите

Answer 3

Что если вы просто убедитесь, что выбор пользователя не в конце?

if (e.which === 32 && (e.target.selectionStart === 0 || e.target.selectionStart === this.value.length && this.value.includes(" "))) {}

Это проверит, находится ли выделение в конце ввода И что в нем уже есть пробел (то есть пробел, который вы хотите разрешить между двумя именами).

Другие ответы, использующие метод .trim(), будут работать с событием "keyup" после обновления значения, но не с "keydown" (как показано в вашем вопросе).

Answer 4

использовать трим

" a ".trim()
will be -> "a"

если вы хотите знать, вставил ли пользователь какой-либо пробел в начале или конце поля, просто сравните длины после обрезки

" a ".trim().length === " a ".length
false

"a".trim().length === "a".length
true

Answer 5

Просто используйте метод Trim javascript, он удаляет пробелы до и после ввода,

так что если у вас есть что-то вроде "Боба Смита",

возвращает вам "Боб Смит"

var str = "       Bob Smith!        ";
console.log(str.trim());

// вывод "Боб Смит"