4.3.創建一個具有文字提示的文本輸入框

2024-04-27 13:51:53

字體：大中小

來源：轉載

供稿：網友

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>