Jquery允许在字母数字验证中使用空格

Jquery allow spaces in alpha numeric validation

本文关键字：验证 空格 数字 Jquery      更新时间：2023-09-26

我正在尝试用jquery对文本框值进行验证，以确保文本框只接受字母数字值。我也试图在单词之间留出空格。我不想在文本框中的句子左右两边留空格。如何在文本框中的单词中间留出空格？

我的踪迹搅乱

$('#dsTest').keyup(function() {
  if (this.value.match(/[^a-zA-Z0-9]/g)) {
    this.value = this.value.replace(/[^a-zA-Z0-9]/g, '');
  } 
});

如果只使用keyup，您将无法优雅地完成这项工作，因为在输入句子的过程中，您刚才输入的空格（希望它位于中间）位于末尾。

相反，我会做这样的事情：

$('#dsTest').keyup(function() {
  if (this.value.match(/[^a-zA-Z0-9 ]/g)) {
    this.value = this.value.replace(/[^a-zA-Z0-9 ]/g, '');
  } 
});
$('#dsTest').focusout(function() {
  this.value = this.value.trim();
});

允许在键入过程中键入空格，并在以后某个合理的时间点用String.trim()去掉前导空格和尾随空格。在我的示例中，我使用.focusout()，但您也可以在使用该值时进行修剪。

这是一个更广泛的验证问题类别的例子，在该类别中，输入WHILE输入的测试会阻止用户输入一个一旦输入就合法的值，因为每次输入一个字符需要该值暂时处于无效状态。有两种主要的方法来处理这个问题：

  • 在用户输入完值之前，不要进行验证测试
  • 标记无效值而不是更改它们

您也可以将两者结合起来，例如，在用户键入时高亮显示字段以显示当前值无效，然后如果用户在无效值仍然存在时离开字段，则也可以修复该值以使其有效。

在纯正则表达式中，这应该适用于/^[a-zA-Z0-9]+[a-zA-Z0-9's]*[a-zA-Z0-9]+$/g。请注意，这将需要在值中至少包含2个字符。如果你也想让它为空，那么你可以做/^([a-zA-Z0-9]+[a-zA-Z0-9's]*[a-zA-Z0-9]+|)$/。

话虽如此，正如其他答案所提到的，在可用性方面，只修剪值可能会更好，因为如果用户意外添加了前导或尾随空格，这不会阻止用户向前移动。

相关文章：