4.3.创建一个具有文字提示的文本输入框

2023-08-05 15:52:26

字体：大中小

来源：转载

供稿：网友

4.3.1. 问题
我想创建一个具有预测能力的TextInput，他会从词典中找出一些推荐的单词供用户选择。
4.3.2. 解决办法
使用TextInput 组建的change 事件监听用户输入，同时使用正则表达式测试词典里是否有何用户输入的内容相匹配的单词。
4.3.3. 讨论
TextInput 组建定义了change 事件，TextInput 组件的值的每次变更都会由它来分发。你可以用这个事件去检测用户输入和测试短词典中所有单词的匹配行为。例如:

-XML

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
<mx:Script>
<![CDATA[
[Bindable]
private var probableMatches:Array;
private var allWords:Array = ["apple", "boy", "cat",
"milk", "orange", "pepper", "recipe", "truck"];
private var regexp:RegExp;
private function checkInput():void
{
var i:int = 0;
var temp:Array = allWords.filter(filter);
input.text = temp[0];
}
private function filter(element:*, index:int,
arr:Array):Boolean
{
regexp = new RegExp(input.text);
return (regexp.test(element as String));
}

]]>
</mx:Script>
<mx:TextInput id="input" change="checkInput()"/>
</mx:Canvas>