length函数用法(c语言length函数用法)

length函数用法(c语言length函数用法)

扫码添加渲大师小管家,免费领取渲染插件、素材、模型、教程合集大礼包!

在上一篇的《中继器使用场景(五):真实环境注册。多身份登录。找回密码》中提到。会专门就注册条件验证的案例出一篇教程。今天就详述如下:

length函数用法(c语言length函数用法)

原型参照:QQ注册。为了集中讲解。将qq昵称注册和邮箱账号注册合二为一。为大家演示。

先看演示GIF图

length函数用法(c语言length函数用法)

功能梳理

1。昵称不能包含中文。不能为空。失去焦点时。会出现不同的提示

2。密码不能包含空格。长度为8-16位。包含字母。数字。特殊符号(英文半角符号)不少于2种

3。密码框在密码输入变化时。实时检测是否符合标准(留意gif图中“灰色!”和“绿色√”图标的变化)

4。点击眼睛图标。能将密码中的“●”显示为输入的文本。松开鼠标时。又恢复为“●”

5。密码框失去焦点时。如果密码不符合规则。按优先顺序显示错误提示(留意gif图中红色错误提示的出现规律)

6。邮件地址不能为空。要有“.”“@”符号。不能包含中文。“.”和“@”之间要有字符。不能有两个@

7。手机号必须是数字。必须是1开头。必须满11位

8。验证码为两个数字两个字母组合。每刷新一次。更换一次。随机更换。不重复。

9。验证码栏不能为空。不能和验证图片不符

需要用到的函数

1。length:获取当前文本对象的长度。即字符个数;1个汉字的长度按1计算。

2。charAt(index):获取当前文本对象中指定位置的字符。index为大于等于0的整数。位置从0开始算

3。charCodeAt(index):获取当前文本对象中指定位置字符的Unicode编码。起始位置从0开始。

4。indexOf(‘searchValue’):从左至右获取查询字符串在当前文本对象中首次出现的位置。未查询到时返回值为-1。

5。lastIndexOf(‘searchvalue’):从右至左获取查询字符串在当前文本对象中首次出现的位置。未查询到时返回值为-1。

6。数字函数Math.random:随机数函数。返回一个0~1之间的随机数。

7。数字函数Math.floor(x):向下取整函数。获取小于或者等于指定数值的最大整数。x为数字

原型制作

第一部分 昵称注册验证

元件分布

length函数用法(c语言length函数用法)

交互设置

length函数用法(c语言length函数用法)

特别说明:

nicheng文本框和nicheng2文本框都要隐藏边框。边框颜色的变化靠矩形nicheng□来表现charAt(index)的起始位置为0而不是1。这是“LVAR1.length-1”的原因当按下Backspace键即退格删除键时。nicheng2文字==nicheng的原始文本。nicheng2比nicheng多一个字符。多的这个字符就是记录nicheng被删除的那个字符。看下方GIF示例length函数用法(c语言length函数用法)

这个交互有一定的瑕疵。就是按退格键时要从后向前依次删除。能够正常演示。如果是鼠标随意插入到汉字的前后。进行删除。就不能正常判断了。

这个靠AXURE自身是解决不了的。会写JS编码的朋友。可以在axure中写入JS编码来实现。也欢迎会写代码的朋友。在回复中留言。

第二部分 密码的注册验证

元件分布

length函数用法(c语言length函数用法)

交互设置

length函数用法(c语言length函数用法)length函数用法(c语言length函数用法)length函数用法(c语言length函数用法)

最后加上。密码可见性的交互

length函数用法(c语言length函数用法)

特别说明:

length函数用法(c语言length函数用法)

为什么一定是英文半角符号。因为在实际写代码的过程中。当输入密码时。会只允许调用英文键盘。不会出现汉字和全角符号。所以大家在测试演示原型时。要输入半角英文符号测试。

length函数用法(c语言length函数用法)

第三部分 邮箱地址的注册验证

元件分布

length函数用法(c语言length函数用法)

交互设置

length函数用法(c语言length函数用法)

特别说明:有兴趣的朋友。可以将“不能含有汉字”的交互加入进去。在这里就不再赘述

第四部分 手机号码的注册验证

元件分布

length函数用法(c语言length函数用法)

交互设置

length函数用法(c语言length函数用法)

特别说明:有兴趣的朋友。可以将“不能含有汉字”的交互加入进去。在这里就不再赘述。还可以加入“不能有5个以上相同的数字”的交互。用Unicode判断即可

第五部分 验证码的注册验证

元件分布

length函数用法(c语言length函数用法)

交互设置

length函数用法(c语言length函数用法)

[[Math.floor(Math.random()*10)]] 取0-9的随机数

[[LVAR1.charAt(Math.floor(Math.random()*52))]] 随机截取写有52个字母的zimu文本框中的字母

length函数用法(c语言length函数用法)

所有关于靠函数验证注册条件的交互完毕。

本文由 @bobowang 原创发布于人人都是产品经理。未经许可。禁止转载

题图来自 Pexels 。基于 CC0 协议

分享到 :
相关推荐

qq代理服务器设置方法(怎么代理qq业务平台)

大家好,今天来介绍qq代理服务器设置方法的问题,以下是渲大师小编对此问题的归纳和整理...

代码压缩包怎么做(java压缩文件夹为zip)

1、代码压缩包怎么做代码压缩包是一种将多个文件或文件夹压缩成一个单独文件的方式,用[...

时间戳是什么类型数据(把时间戳转换成具体的时间的格式)

把时间戳转换成具体的时间的格式时间戳,又称为Unix时间戳,是从1970年1月1日[...

java多态性是如何实现的(java子类继承父类的构造方法)

1、java多态性是如何实现的Java多态性是面向对象编程中的重要概念,它通过方法[...

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注