EduCoder-Web程序设计基础-html5— 对表单进行验证-第4关:pattern验证

任务描述

本关任务:创建一个文本输入框,并要求对用户输入数字格式进行验证。

相关知识

为了完成本关任务,你需要掌握:1.文本输入框的设置,2.pattern属性,3.正则表达式。

邮箱校验示例
在表单text类型的input标签中添加pattern属性,可以根据匹配要求设置规格字符串。匹配输入6位数字的示例如下。

邮政编码:

邮政编码:

编程要求

根据提示,在右侧编辑器补充代码,在右侧编辑器中的Begin - End区域内补充代码,具体要求是:
1.在form>中创建一个1个年龄的输入框。
2.要求用户必须填写年龄框。
3.年龄输入框中只能输入0-99的数字。
运行效果如下:

密码:

邮箱:
输入格式:xxx@xxx

年龄:

测试说明

平台会对你编写的代码进行测试:
补充代码后,请点击测评,平台会对你编写的代码进行测试,如果正确则完成闯关任务。

越努力越幸运,祝你成功!

代码示例

<html>
  <head>
   <meta charset="utf-8"/>
   <title>设置年龄校验</title>
  </head>
  <body>
   <form>
      密码:
     <input type="password"  required="required" title="请输入6位密码!" maxLength="6"/><br/>
     邮箱:
      <input type="email"  required="required" placeholder="输入格式:xxx@xxx"/><br/>
     年龄:
   <!-- ********* Begin ******* -->
     <form>
     年龄:<input type="text"  required="required" pattern="^[1-9]?[0-9]$"/>
    <input type="submit"  value="提交"
    </form>
   <!-- ********* End ********* -->
     <br/> <input type="submit"  value="提交"/> 
    </form>
  </body>
 </html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值