html5制作学学课件,网页设计与制作教学课件作者HTML+CSS+JavaScript张洪斌教学资源5_JavaScript编程_电子课件课件.ppt...

任务3 表单验证的设计 5.16 表单验证的意义与实现 二、表单验证的类型及其实现 (2)必填验证 表单元素中不能没有文本或只有空格文本。 【实例】必填验证 1)定义必填验证的函数isFilled，对形参表单元素element实现必填验证。 2)为需验证的表单元素设置表示必填验证属性。 3)在表单验证函数validateForm的for语句中添加isFilled调用代码。 任务3 表单验证的设计 5.16 表单验证的意义与实现 二、表单验证的类型及其实现 (3)邮箱格式验证 邮箱地址串中一定有“@”和“.”字符。 【实例】邮箱格式验证的实现。 为简化起见，邮箱格式验证只考虑邮箱地址串包含“@”和“.”字符，暂不考虑位置和其它规定。 为需邮箱格式验证的表单元素设置表示邮箱格式验证属性和在表单验证函数validateForm的for语句中添加代码段的任务有大家完成。 任务3 表单验证的设计 5.16 表单验证的意义与实现 二、表单验证的类型及其实现 其它验证也是使用表单元素的属性特别是value属性构造关系表达式，从而实现某种规则的设置，如更多的验证这里就不再介绍了，只是将关系表达式罗列如下： 仅数值字符： !isNaN(Number(element.value)) 仅汉字字符： !/[^\u4E00-\u9FA5]/g.test(element.value) 仅数字字符： !/[^0-9]/g.test(element.value) 仅字母字符： !/[ ^a-zA-Z]/g.test(element.value) 日期格式： /\d{4}-\d{1,2}-\d{1,2}/g.test(element.value) 任务3 表单验证的设计 任务实施 本任务从静态页面设计三个方面进行设计，设计步骤分别如下： 第一步、HTML设计提供页面元素； 第二步、CSS设计布局与美化页面元素； 第三步、JavaScript设计处理页面元素的事件。 任务3 表单验证的设计 任务实施 本任务从静态页面设计三个方面进行设计，设计步骤分别如下： 第一步、HTML设计提供页面元素； 第二步、CSS设计布局与美化页面元素； 第三步、JavaScript设计处理页面元素的事件。 任务3 表单验证的设计 任务实施 本任务从静态页面设计三个方面进行设计，设计步骤分别如下： 第一步、HTML设计提供页面元素； 第二步、CSS设计布局与美化页面元素； 第三步、JavaScript设计处理页面元素的事件。 任务3 表单验证的设计 任务实施 本任务从静态页面设计三个方面进行设计，设计步骤分别如下： 第一步、HTML设计提供页面元素； 第二步、CSS设计布局与美化页面元素； 第三步、JavaScript设计处理页面元素的事件。 任务3 表单验证的设计 任务拓展 一、JSON对象作为属性节点的值 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。JSON采用完全独立于语言的文本格式，易于人阅读和编写，同时也易于机器解析和生成，成为理想的数据交换语言 利用JavaScript中提供eval函数，将字符串去引号后求值的功能，可以用符合json格式的字符串给DOM属性节点赋值。如：