Axure RP中文网站 > 使用教程 > Axure RP表单输入如何校验 Axure RP数据检测教程
Axure RP表单输入如何校验 Axure RP数据检测教程
发布时间:2026/06/30 13:36:47

品牌型号:联想Yoga 14Sitl

系统:Windows 10 64位专业版

软件版本:Axure rp 9

表单输入校验是提升用户体验和交互合理性的重要一步,它能防止用户提交无效或错误的信息。而数据检测功能则让Axure RP的原型更接近真实产品,方便我们提前发现问题、进行测试和优化。下面就为大家介绍Axure RP表单输入如何校验,Axure RP数据检测教程的相关内容。

一、Axure RP表单输入如何校验

Axure RP中,可以利用变量、条件判断和交互事件来模拟表单输入校验,校验如手机号格式是否正确、密码不能为空或邮箱地址是否规范等。虽然不涉及后端逻辑,但在原型测试阶段模拟这些校验过程,有助于提升测试的真实感。接下来用校验输入的手机号码位数是否正确为例子为大家介绍表单输入如何校验。

1、表单界面准备。在左侧默认元件库里找到文本框元件,涉及到输入场景都需要用到这个元件。要特别注意区分文本框和文本标签元件,虽然它们长得像,但功能完全不同。文本框允许用户输入内容,而文本标签只是静态文字展示。用错的话,原型功能就乱套了。在右侧样式里输入提示文字:请输入手机号码。用文本标签元件打上:手机号码。

表单界面
图1:表单界面

再用文本标签元件打上:手机号码错误!。鼠标右键在上下文菜单中找到【设为隐藏】。这个提示标签只有在手机号码错误的时候才会显示出来。

隐藏提示
图2:隐藏提示

2、设置交互事件。在电脑上,我们一般输入表单内容后,会习惯性点一下页面空白的位置,这个动作在Axure里可以转为交互触发事件——失去焦点时。我们把这个事件绑定在文本框上,这样当用户输完手机号移开光标时,就会自动触发位数检查。校验不通过就显示手机号码错误提示,因此动作是【显示/隐藏】。

设置交互
图3:设置交互

3、添加逻辑判断。我们常有的手机号码是十一位数,这是我们知道的事实,但Axure是不知道的。我们需要为它制定规则,告知软件什么情况叫错误或正确的手机号码。将鼠标移动到失去焦点时事件的后方,会出现一个【启用情形】按钮。点击后打开情形设定窗口。

启用情形
图4:启用情形

将情形命名为手机号码错误,第一个选项选择元件文字长度,对象选的是当前文本框,这样Axure会自动识别当前字符的位数。符号选择的是【!=】表示不等于。值填写11。这样规则就设定好了。

规则设定
图5:规则设定

4、预览测试。点击右上角的预览按钮打开界面后,输入十位数的手机号码,再点击空白位置,出现手机号码错误提示。说明对表单的输入展开了校验,校验不通过。

校验不通过
图6:校验不通过

二、Axure RP数据检测教程

在原型中除了校验输入合法性,还可以模拟数据检测流程,如用户名是否已注册等。这类数据检测通常结合变量、逻辑判断和反馈提示来实现。接下来我们用账号与密码的匹配为例子进行数据检测的教程。

1、设置全局变量。在Axure里创建变量就像建个小数据库,直接在顶部菜单栏的项目里找到全局变量就能设置。

创建全局变量
图7:创建全局变量

我们创建两个变量:密码password,初始值为123,账号account,初始值为admin。

变量赋值
图8:变量赋值

2、界面设计。用文本标签元件分别打上:账号、密码。再放入两个文本框,分别命名为账号和密码,有两个文本框的时候建议要命名,后续使用才不会混淆。放上登录按钮。再用文本标签元件打上【登录成功!】提示,鼠标右键将它【设为隐藏】。

界面设计
图9:界面设计

3、交互事件设置。我们要实现的是点击登录按钮时,展开数据检测,符合设定好的账号和密码才能够登录,显示登录成功提示。因此触发事件是【单击时】,动作是【显示/隐藏】。

4、情形设定。打开情形编辑窗口,将情形命名为登录成功。这里需要进行两个数据检测。第一,检测输入的账号内容和设定的账号是否吻合。第一个选项填写的是元件文字,对象是账号文本框,通过这两个选项读取到输入的内容。中间符号是等于号。第四个选项填写的是变量值,第五个填的是account,通过这两个选项读取变量值。通过等式左右两边的比对,检测账号是否正确。

第二,检测输入的密码内容和设定的密码是否吻合。只要将账号检测中的对象改为密码文本框即可。这两个检测是并行的关系,意思是只有两个等式都成立,整体的检测才会通过,才能够成功登录。

情形设定
图10:情形设定

5、预览测试。点击预览按钮,当我们输入admin和123时,显示登录成功。

预览测试
图11:预览测试

以上就是Axure RP表单输入如何校验,Axure RP数据检测教程的相关内容。通过设置表单输入校验,可以模拟真实的输入限制,让原型的交互看起来更贴近实际使用。掌握这些数据检测的方法,有助于我们搭建更符合用户习惯的输入流程和反馈机制。

135 2431 0251