flex 点击按钮加载本地图片问题

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
               creationComplete="init(event)">
    <fx:Declarations>
        <!-- 将非可视元素（例如服务、值对象）放在此处 -->
    </fx:Declarations>
    <s:layout>
        <s:VerticalLayout gap="5"/>
    </s:layout>
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;

            private var fr : FileReference;
            private var imageType : FileFilter;

            //点击按钮打开选择本地文件窗口
             protected function clickHandler(event:MouseEvent):void
            {
                // TODO Auto-generated method stub
                fr.browse([imageType]);
            }

            //组件加载完成对一些变量进行初始化
            protected function init(event:FlexEvent):void
            {
                // TODO Auto-generated method stub
            fr = new FileReference();
            imageType = new FileFilter("Images (*.jpg, *.jpeg, *.png, *.gif)","*.jpg; *.jpeg; *.png; *.gif;");  
            //为窗口添加用户选择事件监听
                        fr.addEventListener(Event.SELECT,selectHandler);
            }

            //用户选择后添加完成监听，当用户在点击窗口的最后一个按钮后出发此事件
            private function  selectHandler(event:Event):void{
                fr.addEventListener(Event.COMPLETE,oncompleteHandler);
                fr.load();
            }
            private function  oncompleteHandler(event:Event):void{
                imageId.source=fr.data;
            }
        ]]>
    </fx:Script>

    <s:Button click="clickHandler(event)" label="加载图片"/>
    <s:Image id="imageId"/>
</s:Application>

不得不说，flex大势已去，但是公司产品用的是这个就得上啊，HTML5大行其道，最新版谷歌浏览器已经不支持flash了，所以，flex能不做就别做了。