如何实现文本字段开头不允许输入空格的验证？

针对你的需求，我们可以通过自定义验证规则结合正则表达式来实现，下面分常见的两种验证场景给出具体实现：

一、使用jQuery Validation插件的情况 #

如果你的项目用的是jQuery Validation，先注册自定义验证方法，再修改验证规则：

1. 注册自定义验证器

// 注册名为noLeadingSpace的验证规则
$.validator.addMethod("noLeadingSpace", function(value, element) {
    // 空值交由required规则处理，非空时检查开头是否为非空白字符
    return this.optional(element) || /^\S/.test(value);
}, "输入内容不能以空格开头");

2. 修改你的验证规则
   把原规则里的noSpace: true替换为自定义的规则：

regno: {
    required: true,
    maxlength: 20,
    noLeadingSpace: true
}

二、使用Vue生态的VeeValidate的情况 #

如果是Vue项目用VeeValidate，自定义规则的方式如下：

1. 定义验证规则

import { defineRule } from 'vee-validate';

// 定义开头不能有空格的规则
defineRule('noLeadingSpace', (value) => {
    if (!value) return true; // 空值由required规则管控
    return /^\S/.test(value) || '输入内容不能以空格开头';
});

2. 应用到字段验证

// 在表单验证规则中使用
regno: ['required', 'max:20', 'noLeadingSpace']

正则说明 #

/^\S/这个正则的含义是：

• ^：匹配字符串的起始位置
• \S：匹配任意非空白字符（包括空格、制表符、换行符等）
  整体就是确保输入内容的第一个字符不是空白字符。

内容的提问来源于stack exchange，提问作者Athira Anil