《PHP动态网站开发》模拟教学确认密码的验证

团队合作责任开拓专业：软件技术课程：PHP动态网站开发主题：表单数据处理--以注册和登录为例第2学时模拟教学2019年山东省职业院校教学能力大赛教案目录

Contents教案

目录你的数据合法了吗？-注册表单的数据验证1验证码为你保驾护航-验证码的作用与创建2验证码为你保驾护航-验证码的升级、加载与刷新3验证码为你保驾护航-验证码的正确性判断4验证码为你保驾护航-表单数据回填5你心仪的账号被人用了吗？-注册信息的查重6你的数据会去哪里？-注册信息的保存与加密7你的账号能用了吗？-实现登录功能8教案内容

Contents表单数据验证的重要性说明0102完成表单的数据验证重点+难点：使用正则表达式完成邮件地址、密码、手机号等的数据验证使用js函数完成确认密码的验证使用js函数完成确认密码的验证课前预习课中探究课中练习课中考核课后提升摇一摇回答问题：对于两次密码的一致性判断，为何要使用js函数完成，而不能使用HTML5正则表达式完成？HTML5正则表达式只能在一个元素内部对其数据进行合法性验证，而对两次密码的一致性判断，需要使用的数据分别来自密码和确认密码两个元素，因此无法使用HTML5的正则表达式完成，只能使用js函数完成难点：使用js代码阻止非法数据提交的原理连环扣问题1-一起回答：点击什么按钮时能够将注册界面的数据提交给服务器？课前预习课中探究课中练习课中考核课后提升连环扣问题2-头脑风暴：点击submit按钮时，触发的是哪一个元素的什么事件？对应的事件属性是什么？点击submit类型的按钮“立即注册”时提交数据Button按钮文本超链接……触发元素自身的click事件submit按钮触发<form>标记中的submit事件，对应的事件属性是onsubmit难点：使用js代码阻止非法数据提交的原理连环扣问题3-抢答问题：你认为在属性onsubmit中使用什么样的js代码可以阻止数据提交给服务器？课前预习课中探究课中练习课中考核课后提升使用onsubmit="returnfalse"可以阻止修改代码：<formmethod="post"action="zhuce.php"onsubmit="returnfalse">onsubmit="returnfalse"的应用课前预习课中探究课中练习课中考核课后提升我的数据都是按照要求填写的，点击“立即注册”为啥没有响应？若是onsubmit设置为returnfalse，无论数据是否符合要求，都不会将数据提交给服务器修改代码：<formmethod="post"action="zhuce.php"onsubmit="returntrue">onsubmit="returntrue"的应用课前预习课中探究课中练习课中考核课后提升输入密码111111确认密码123456若是onsubmit设置为returntrue，无论确认密码和密码是否相同，都会将数据提交给服务器需要的方案及结论课前预习课中探究课中练习课中考核课后提升onsubmit=？表单数据不符合要求服务器returnfalse表单数据符合要求服务器returntrue两次密码一致的验证函数要求：若是两次密码一致，则函数返回true，否则返回false判断两次密码一致的操作流程课前预习课中探究课中练习课中考核课后提升开始获取用户输入的密码获取用户输入的确认密码两次密码一致吗？returntrue提示：两次密码必须一致，请重新输入returnfalse开始NOYES摇一摇问题：如何把双分支结构改成单分支结构？使用代码完成两次密码的一致性判断定义函数validate()，按照流程图完成代码，使用<form>标记中onsubm