用户管理界面 展示内容：填写项和按钮（保存、取消）

Question

         用户管理界面

实现用户的查询、添加、编辑和删除功能。
（1）默认打开的是查询界面。（2分）
（2）添加、编辑和删除在查询界面中来实现跳转。（3分）
1.1.3. 查询界面要求

1. 整个界面分为上下两部分：查询条件区和数据展示区。（2分）
2. 查询条件：姓名、手机号、状态（下拉选择框，取值为全部、启用、禁用）。（2分）
3. 按钮，查询，类型button。
4. 按钮，重置,类型为button。
5. 按钮，添加，类型button。
6. 按钮，删除，类型button。
7. 数据区展示项：复选框、姓名、手机号、邮箱、地址、状态、创建日期(格式为yyyy-MM-dd HH:mm:ss,如2021-06-01 12:09:03)、操作（包括功能：编辑、删除）。要求必须列出至少5条数据。（3分）
8. 数据区最下面展示分页，包括首页、上页、下页、尾页。（1分）
9. 要求用表单实现，表单method="post"。额

1.1.4. 功能要求

1. 查询按钮，校验输入的条件，必填项，并提示输入的值。（3分）
2. 重置按钮，重置条件中的值为默认值。（2分）
3. 添加按钮和编辑按钮。打开添加页面addOrEdit.html。（2分）
4. 行记录后面操作：删除按钮，confirm提示：确认删除此条记录？。（2分）
5. 查询下面的删除按钮，是批量删除功能，检查行记录checkbox选中情况，如果有就提示：是否确认删除？否则就提示：请选中记录再删除！。（5分）

1.1.5. 添加和编辑要求

1. 展示内容：填写项和按钮（保存、取消）。（2分）
2. 展示内容：
   a) 姓名，必填项，长度2-15个字符，可以考虑只输入中文。（2分）
   b) 手机号，必填项，手机号的规则验证。（2分）
   c) 邮箱，必填项，按邮箱规则验证。（2分）
   d) 地址，必填项，长度不超过60个字符。（2分）
   e) 状态，必填项，下拉选择（请选择/启用/禁用），注意select取值。（2分）
3. 保存按钮，校验通过打开主界面，这里指user.html，否则直接提示错误的填写项。（3分）
4. 取消按钮，直接打开主界面，这里指user.html。（2分）

1.1.6. 技术要求

1. 利用html、css、javascript来实现，但不限于这三种技术。
2. 所有校验必须采用正则表达式。
   帮我写一个程序

Answer 1

题目主要还是考查HTML界面设计和JS验证，建议先完成最基本的界面，再进一步完成验证和跳转