登录注册验证(JavaScript)-PHP教学课件5.ppt

5.1 项目导引：用户注册验证 大家在网站登录注册时是不是有这样的体会？ 如果有必填项而没有填写，网站会提示我们此项目不能为空； 如果设置密码的长度不够，网站会提示我们密码长度不够； 如果注册密码与确认密码不一致，网站会提示我们密码不一致； 如果信息格式输入不正确（如邮箱地址、手机号码），网站会提示我们格式不正确。 那么这些功能是如何实现的呢？ 通过JavaScript客户端脚本可以对用户输入的数据进行检查 5.2 项目分析 JavaScript脚本语言是一种面向浏览器的网页脚本编程语言，JavaScript脚本在客户端浏览器执行。 用户注册过程中的主要验证包括： 用户名、密码和邮箱地址等内容的非空验证； 密码长度为6-20个字符，且是英文字母、数字及符号的组合； 注册密码与确认密码是否一致； 电子邮箱格式是否正确。 5.3 技术准备 5.3.1 JavaScript基础 JavaScript语句的基本语法规则与PHP语法类似，每条语句以“；”为结束符，注释语句有单行注释（//）和多行注释（/*…*/）两种，变量、函数名以及关键词都是区分大小写的。 1．在网页中加入JavaScript （1）直接嵌入HTML文档 （2）引用方式 例5-1 5.3 技术准备 5.3.1 JavaScript基础 2．数据类型 5.3 技术准备 5.3.1 JavaScript基础 3．变量 变量名是一种标识符，由字母、数字、下划线（_）或美元符号（$）构成的字符序列组成，但首字符不能是数字，也不能包含空格、+、-等特殊字符。 JavaScript中通过var关键字来声明变量 var 变量名[=初值][，变量名[=初值]，…] 例5-2 5.3 技术准备 5.3.1 JavaScript基础 4．运算符与表达式 JavaScript中运算符与表达式与php基本相同 JavaScript中字符串连接运算符与php不同，JavaScript中把“+”或“+=”作为字符串连接运算符。 例5-3 5.3 技术准备 5.3.2 JavaScript流程语句 1．条件语句（if...else） if (表达式){ 语句组1 }else{ 语句组2 } 例5-4 5.3 技术准备 5.3.2 JavaScript流程语句 2．循环语句 （1）while语句 其语法格式如下所示： while (表达式){ 语句组 } （2）do...while语句： 其语法格式如下所示： do { 语句组 } while (表达式) 5.3 技术准备 5.3.2 JavaScript流程语句 2．循环语句 （3）for语句： 其语法格式如下所示： for(初值表达式，循环判定表达式，更新表达式){ 语句组 } 例5-5、例5-6 、例5-7 5.3 技术准备 5.3.3浏览器对象 JavaScript是一种基于对象（Object）的编程语言，可以使用内置对象、浏览器对象和自定义对象。 JavaScript语言提供的内置对象主要包括：数学对象（Math）、日期对象（Date）、字符串对象（String）和数组对象（Array）等 浏览器对象（BOM）用于访问与操纵浏览器窗口 窗口对象（window） 文档对象（document） 地址对象（location） 浏览器对象（navigator） 屏幕对象（screen） 历史对象（history）。 5.3 技术准备 5.3.3浏览器对象 1．window对象 window对象表示整个浏览器窗口，通过对象的方法我们可以定制、打开和关闭浏览器窗口。其常用方法如表所示。 5.3 技术准备 5.3.3浏览器对象 1．window对象 （1）使用对话框 使用window对象的alert()、confirm()和prompt()方法，可以弹出警示、确认和提示对话框。 例5-8、例5-9 （2）打开和关闭窗口 使用window对象的open()、close()方法可以打开、关闭窗口。 例5-10 （3）使用定时器 使用window对象的setInterval()方法，可以实现让一段程序每隔一段时间就执行一次的定时机制。 例5-11 5.3 技术准备 5.3.3浏览器对象 2．Document 对象 Document对象表示在浏览器窗口中显示的页面文档。除了提供文档整体信息的属性外，Document对象还有很多的重要属性，这些属性提供文档内容信息。如，forms[]集合属性存放的Form对象是文档中的所有表单，images[]集合属性和links[]集合属性存放的是文档中的所有图像和超链接对象。 （1）表单的访问 如下面的HTML页面： form method=post action=login.php na