使用Flex-Ajax Bridge实例
<?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" xmlns:bridge="bridge.*" minWidth="955" minHeight="600"><s:layout><s:VerticalLayout /></s:layout><fx:Script><![CDATA[import mx.controls.Alert; public function btnClick():void { Alert.show("按钮被点击了","title"); } protected function button1_clickHandler(event:MouseEvent):void{// TODO Auto-generated method stubtxtName.text=String(ExternalInterface.call("getValueFromAjax"));}]]></fx:Script><fx:Declarations><bridge:FABridge/><!-- 将非可视元素(例如服务、值对象)放在此处 --></fx:Declarations><s:TextInput verticalCenter="0" id="txtName"/><s:Button label="Get value" verticalCenter="0" click="button1_clickHandler(event)" /><s:Button label="测试回调" id="btn"/> </s:Application>
HelloFlexAjax.html内容如下:
<!-- This file is just a basic wrapper for your bridged, Ajax/Flex, application. This file will NOT be overwritten once it has been generated, therefor it is perfectly safe to customize it to fit your needs. If you need to have this file re-generated, please delete it. --><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Test page for the HelloFlexAjax class</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script type="text/javascript" src="lib/FABridge.js"></script><script type="text/javascript" src="HelloFlexAjax.js"></script><script type="text/javascript"> //修改文本框内的文本function jsSetText(){ var txtInput = HelloFlexAjax.getTxtName(); txtInput.setText("测试");} function getValueFromAjax(){return "调用成功";}function jsSetCallback(){HelloFlexAjax.getBtn().setLabel("可以测试回调了");HelloFlexAjax.getBtn().addEventListener("click",HelloFlexAjax.btnClick); }</script></head><body><h1>Test page for the <code>HelloFlexAjax</code> class</h1><input type="button" value="设置文本框" onClick="jsSetText()"/> <input type="button" value="设置回调" onClick="jsSetCallback()"/> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"id="HelloFlexAjaxTest" width="700" height="600"codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab"><param name="movie" value="../../bin-debug/HelloFlexAjax.swf" /><param name="flashvars" value="bridgeName=b_HelloFlexAjax"/><param name="quality" value="high" /><param name="allowScriptAccess" value="sameDomain" /><embed src="../../bin-debug/HelloFlexAjax.swf" quality="high"width="700" height="600" name="HelloFlexAjaxTest" align="middle"play="true"loop="false"quality="high"allowScriptAccess="sameDomain"type="application/x-shockwave-flash"pluginspage="http://www.adobe.com/go/getflashplayer" flashvars="bridgeName=b_HelloFlexAjax"></embed></object><h2>Test controls</h2><p>Description text goes here.</p></body></html>
HelloFlexAjax.js文件如下:
/** * WARNING! THIS IS A GENERATED FILE, AND WILL BE RE-GENERATED EACH TIME THE * AJAXBRIDGE IS RUN. * * You should keep your javascript code inside this file as light as possible, * and rather keep the body of your Ajax application in separate *.js files. * * Do make a backup of your changes, before re-generating this file (AjaxBridge * will display a warning message to you). * * Please refer to the built-in documentation inside the AjaxBridge application * for help on using this file. */ /** * Application "HelloFlexAjax.mxml" *//** * The "HelloFlexAjax" javascript namespace. All the functions/variables you * have selected under the "HelloFlexAjax.mxml" in the tree will be * available as static members of this namespace object. */HelloFlexAjax = {};/** * Listen for the instantiation of the Flex application over the bridge */FABridge.addInitializationCallback("b_HelloFlexAjax", HelloFlexAjaxReady);/** * Hook here all the code that must run as soon as the "HelloFlexAjax" class * finishes its instantiation over the bridge. * * For basic tasks, such as running a Flex method on the click of a javascript * button, chances are that both Ajax and Flex may well have loaded before the * user actually clicks the button. * * However, using the "HelloFlexAjaxReady()" is the safest way, as it will * let Ajax know that involved Flex classes are available for use. */function HelloFlexAjaxReady() {// Initialize the "root" object. This represents the actual // "HelloFlexAjax.mxml" flex application.b_HelloFlexAjax_root = FABridge["b_HelloFlexAjax"].root();// Global variables in the "HelloFlexAjax.mxml" application (converted // to getters and setters)HelloFlexAjax.getTxtName = function () {return b_HelloFlexAjax_root.getTxtName();};HelloFlexAjax.getBtn = function () {return b_HelloFlexAjax_root.getBtn();};HelloFlexAjax.btnClick = function() { b_HelloFlexAjax_root.btnClick(); }; // Global functions in the "HelloFlexAjax.mxml" application}