Axure进行邮箱格式验证具体流程介绍

想了解Axure进行邮箱格式验证的步骤吗?可以跟随小编一同去下文看看Axure进行邮箱格式验证的具体流程介绍 。

Axure进行邮箱格式验证具体流程介绍


1、我们这里以文本框为例,新建一个文本输入框,然后在建一个标签 。文本输入框用来输入需要校验的信息,标签是我们要显示的提示语 。如图所示:
Axure进行邮箱格式验证具体流程介绍


2、设置标签样式 。选中标签,将提示语的文字颜色给为红色,然后设置为隐藏 。勾选右上角的隐藏选项即可 。
Axure进行邮箱格式验证具体流程介绍


Axure进行邮箱格式验证具体流程介绍


3、设置输入框失去焦点事件 。选中文本输入框,单击交互面板中的失去焦点时--打开交互设置界面 。
Axure进行邮箱格式验证具体流程介绍


4、设置判断条件 。点击添加条件,设置判断条件如图所示:邮箱验证比较简单,我们一般只需要验证@符号和.com两个关键点 。所以只要输入的文字中不包含这两个元素中的任何一个,我们就显示提示标签 。
【Axure进行邮箱格式验证具体流程介绍】注意:添加两个条件一定要选择任何,不要选择全部,这个就是and和or的区别 。
Axure进行邮箱格式验证具体流程介绍


5、配置条件对应的动作 。点击显示--然后选择我们第二步中隐藏的提示标签 。这样在文本框失去焦点的时候会校验我们添加的条件,如果条件满足,就显示提示标签 。
Axure进行邮箱格式验证具体流程介绍


6、配置文字改变时条件及动作 。点击交互面板中的文字改变时--添加条件 。我们这里要选择文字中包含@并且包含.com,提示的标签隐藏 。
注意:这里两个条件要选择全部,必须是两个条件同时满足才可以 。如图所示:
Axure进行邮箱格式验证具体流程介绍


Axure进行邮箱格式验证具体流程介绍


Axure进行邮箱格式验证具体流程介绍


7、点击预览,输入一个错误的格式,会提示格式不正确,修改会提示消失 。
Axure进行邮箱格式验证具体流程介绍


Axure进行邮箱格式验证具体流程介绍


Axure进行邮箱格式验证具体流程介绍


根据上文为你们讲述的Axure进行邮箱格式验证的具体流程介绍,你们是不是都学会啦!

    推荐阅读