我创建了一个带有用户名和密码字段的在线论坛。问题是,我想添加对输入的限制,以清除无效的用户名格式。(有效的用户名将以XYZ开头的前3个字符)。我是否可以设置一个规则,如果用户名的前3个字母以ABC开头,那么在与服务器进行检查之前,"提交"按钮将变灰并显示一条该用户名无效的消息?但是,如果用户正确键入所需的起始格式字母,那么"提交"按钮将被启用?
我尝试使用与电子邮件地址中要求的@符号相同的主体来编写代码,但结果很奇怪。
最简单的方法是使用HTML5 pattern
属性:
<style>
:invalid { border-color: red }
</style>
<form>
<label for=uname>Username:</label>
<input id=uname name=uname type=text pattern="XYZ.*">
<p><input type=submit value=Submit>
</form>
该示例使用CSS来指示带有红色边框的无效字段。
代码接受任何以XYZ开头的字符串(区分大小写),包括字符串XYZ。根据需要进行修改。
由于pattern
属性不是普遍支持的,因此您可能希望添加执行类似检查的JavaScript代码。在它中,使用正则表达式(如pattern
属性)是最简单的方法。