雪莉果的Axure原型工厂vol.008 函数的应用（一）——控制输入长度

0.同样的需求，可以有不同的解决方案

先看下面一个示例：

在网站的应用中，经常会有这样的功能：需要用户输入文本内容，但是为了减少存储，或者降低分析的消耗，需要控制内容的长度；而上图中的两种方案便是最为常见的处理方式，一类是超过长度不允许提交，另一类便是只能输入规定长度的内容，超出部分直接去除。
当然，这里并不会讨论各个方案的优劣，不同的方案也会有其适配的场景，我们只需要知道，任何的需求，都可能有完全不同的实现方式即可。

1.交互拆解

和之前一样，为了更好的理解这个原型做了什么，我们将交互进行拆解。
方案一
1）文本框内容改变
2）文本长度不超过50，正常继续输入
3）文本长度超过50，计数变红，提交按钮禁用
4）文本框内容继续改变
方案2
1）文本框内容改变
2）文本长度不超过50，正常继续输入
3）文本长度超过50，只取前50个字符
用流程图的形式进行展示，如下图：

接着，我们就按照上述步骤，来制作原型吧。

2.交互设置步骤

1）首先创建所有需要的元件，并且为各元件命名，方便设置交互时选择。

2）为清空按钮设置交互，用以清空输入内容。

3）然后，为按钮和计数的文本设置禁用状态，用以提示文字超过长度。


4）然后，为文本框添加交互，让文本内容改变时去调整按钮和计数文本，这里，引进第一个函数length，用来获取文本的长度

这里的[[LVAR1.length]]就代表文本框中已输入文本的长度。

当文本内容长度超过50时，禁用提交按钮，否则启用。这样第一个方案就算完成了。
5）让我们来实现第二个方案，先复制之前的元件，去除一些不需要的交互。
6）还是在文本框交互中，设置文本内容变化时交互，这里引入第二个函数[[LVAR1.substr(0,50)]]，这个函数表示从第一个字符开始，取50个字符。

3.一些说在最后的话

其实在之前的文章中，也已经引入了很多的函数，不过，我还是打算多花一些时间，将axure中的函数都好好讲一讲，把一些并不是那么常用的内容都体现出来；这些并不常用的内容，也许可以让你事半功倍。