如何实现输入信息已存在校验-Axure基础教程

2025-07-12 15:41:41

1、新建页面,拖入输入框及标签,如图所示。标签我们是用来显示提示信息的,输入提示语,如此邮箱已存在。

如何实现输入信息已存在校验-Axure基础教程

2、设置提示标签的样式。选中标签,设置颜色为红色,然后勾选隐藏选项,默认情况下这个提示标签是隐藏的。

如何实现输入信息已存在校验-Axure基础教程
如何实现输入信息已存在校验-Axure基础教程

3、设置全局变量。点击菜单栏的项目--全局变量。在弹出的面板中输入变量名称以及对应的值。这里我们只需要一个变量就是邮箱的名称,值我们可以输入一个邮箱,也可以输入多个邮箱,用逗号或者其他符号隔开,方便区分。

如何实现输入信息已存在校验-Axure基础教程
如何实现输入信息已存在校验-Axure基础教程

4、设置文本框的失去焦点时交互效果。选中文本框,单击右侧失去焦点时,然后在弹出的面板中单击添加条件

如何实现输入信息已存在校验-Axure基础教程
如何实现输入信息已存在校验-Axure基础教程
如何实现输入信息已存在校验-Axure基础教程

5、设置焦点失去时条件并配置动作。刳噪受刃条件中选中我们设置的全局变量,条件为包含元件的值,如图所示。设置对应的动作,单击显示动作--选中提示标签,单击确定。这样当文本框失去焦点时,会判断全局变量中是否包含文本框中输入的值,如果包含,则显示“此邮箱已存在”。

如何实现输入信息已存在校验-Axure基础教程

6、设置文本改变时交互效果。选中文本框,单击右侧文本改变时,然后偶在弹出的面板中单击添加条件。

如何实现输入信息已存在校验-Axure基础教程

7、设置文本编辑是的条件并配置动作。条件设置如图所示,设置全局变量不包含元件值。配置对应的动作,单击隐藏工辑湃形傥作--选中提示标签,单击确定。当文本发生变化时,会判断全局变量红是否包含文本框中的内容,如果不包含,则隐藏提示标签。

如何实现输入信息已存在校验-Axure基础教程

8、点击预览,输入一个全局变量中存在的邮箱,会出现提示,编辑修改,提示消失。

如何实现输入信息已存在校验-Axure基础教程
如何实现输入信息已存在校验-Axure基础教程
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢