上图就是我们要实现的目标：输入一个汉字能够查到它的拼音首字母。
实际上，明白了实现原理之后，通过汉字查拼音、查声母都是可以实现的。
关键在于有没有一个能够使用的源数据。
我们先来看看元件的准备工作。
上面这张图，大家能够看到这个案例使用的所有元件。
最关键的就是命名为“PinYin”的这个元件，它的文字包含了所有的文字以及对应的拼音首字母。
源数据下载：http://downloads.iaxure.com/pinyin.txt
大家可以下载源数据文件，复制里面的内容，粘贴到Axure编辑区中即可。
我们能够看到源数据的格式有一定的规律：[相同拼音首字母的所有文字][拼音首字母][逗号]……
那么，试想一下，当我们输入一个文字点查询时：
1、查询到汉字在源数据中出现的位置；
2、从查询到的位置向后查询逗号所在的位置；
3、获取到逗号所在位置前一位的拼音首字母。
完美！
所以，当我们准备好元件（注意将元件“PinYin”缩小尺寸后隐藏），就可以添加交互了。
交互如上图所示：
查找按钮“Search”【鼠标单击时】，添加用例与动作：【设置文字】于元件“Result”为一个公式…
具体公式是什么样子的呢？
如下图所示：
公式的完整内容是：“汉字的首字母是：[[p.charAt(p.indexOf(\’,\’,p.indexOf(w))-1)]]”。
简单说明一下：
- “p”和“w”是两个局部变量，分别存入了源数据和输入的汉字内容；
- “p.charAt()”能够获取指定位置的字符；
- “p.indexOf(w)”能够获取汉字在源数据中出现的位置。
- “p.indexOf(\’,\’,p.indexOf(w))-1”能够从汉字位置开始向右查找逗号所在的位置，找到的位置减1就是拼音首字母的位置。
这里值得一提的是“indexOf()”这个函数，它能够由左至右的从一个字符串中查询参数字符串出现的位置，它有两个参数，分别是“被查询的字符串”和“查询的起始位置”，如果没有提供第二个参数默认从最左侧向右查询。
好了，到这里这个案例就完成了。
希望大家能够从这个案例中学习到有用的知识点。
最后，邀请大家关注 搜索引擎订阅号“iaxure”（二维码在本站首页右上方），及时获取本站最新动态内容。
源文件下载：http://downloads.iaxure.com/search_pinyin.rp
Axure实现汉字拼音首字母查询（非JS版）
