FABridge教程(Flex+Ajax) 2

最新推荐文章于 2013-06-16 11:53:07 发布

thinker28754

最新推荐文章于 2013-06-16 11:53:07 发布

阅读量1.9k

点赞数

分类专栏： FLEX 文章标签： flex ajax function application button library

本文链接：https://blog.csdn.net/thinker28754/article/details/5299404

版权

FLEX 专栏收录该内容

49 篇文章 0 订阅

订阅专栏

首先在fademo.mxml中声明一个button，并添加一个btnClick方法：

view plaincopy to clipboardprint?
<?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/halo" minWidth="0" minHeight="0" width="400" height="300" xmlns:bridge="bridge.*">
    <fx:Declarations>
        <bridge:FABridge/>
        
    </fx:Declarations>
    <fx:Script>
        
    </fx:Script>
    <s:TextInput x="160" y="96" id="txtName"/>
    <s:Button x="218" y="139" label="按钮" id="btn"/>
</s:Application>
<?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/halo" minWidth="0" minHeight="0" width="400" height="300" xmlns:bridge="bridge.*">
<fx:Declarations>
  <bridge:FABridge/>
  
</fx:Declarations>
<fx:Script>
  
</fx:Script>
<s:TextInput x="160" y="96" id="txtName"/>
<s:Button x="218" y="139" label="按钮" id="btn"/>
</s:Application>

然后将这个方法暴露给js端，修改（或重新生成）fademo.js，在fademoReady（）方法中添加fademo对btn按钮及btnClick方法的调用：

view plaincopy to clipboardprint?
function fademoReady() {
    b_fademo_root = FABridge["b_fademo"].root();
    fademo.getBtn = function () {
        return b_fademo_root.getBtn();
    };
    fademo.getTxtName = function () {
        return b_fademo_root.getTxtName();
    };
    fademo.callBack = function() {
        b_fademo_root.callBack();
    };
}
function fademoReady() {
b_fademo_root = FABridge["b_fademo"].root();
fademo.getBtn = function () {
  return b_fademo_root.getBtn();
};
fademo.getTxtName = function () {
  return b_fademo_root.getTxtName();
};
fademo.callBack = function() {
  b_fademo_root.callBack();
};
}

这样在html中，因为已经对fademo.js做了引用，所以就可以直接使用新定义的这些方法了，修改html：

view plaincopy to clipboardprint?
<head>
    <title>Test page for the fademo class</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <mce:script type="text/javascript" src="lib/FABridge.js" mce_src="lib/FABridge.js"></mce:script>
    <mce:script type="text/javascript" src="fademo.js" mce_src="fademo.js"></mce:script>
    <mce:script type="text/javascript"></mce:script>
</head>
<body>
<input type="button" value="向文本框发炮" onClick="jsSetText()"/>
………………
<head>
<title>Test page for the fademo class</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<mce:script type="text/javascript" src="lib/FABridge.js" mce_src="lib/FABridge.js"></mce:script>
<mce:script type="text/javascript" src="fademo.js" mce_src="fademo.js"></mce:script>
<mce:script type="text/javascript"></mce:script>
</head>
<body>
<input type="button" value="向文本框发炮" onClick="jsSetText()"/>
………………

OK.

效果:点击html上的button后，flex内文本框内容变为heihei，flex内按钮文本变为haha，此时haha按钮也增加了点击事件，当此时点击haha按钮时，弹出“按钮被点击了”警告。

另外，注意添加事件的代码：

fademo.getBtn().addEventListener("click",fademo.callBack);

如果事件处理函数callBack位于js(alert)而不是在mxml(Alert.show)内，可以直接写为：

fademo.getBtn().addEventListener("click",callBack);

但是，在js中处理和mxml中处理的效果是不一样的，前者是在html内弹出警告框，后者是在flash内弹出警告框。

--------------------------------------------------------------------------------

在flex中操作js也很简单，只需要使用ExternalInterface.call("js方法名")即可。

本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/toraji/archive/2009/12/23/5054890.aspx

thinker28754

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
FABridge教程(Flex+Ajax) 2

首先在fademo.mxml中声明一个button，并添加一个btnClick方法：view plaincopy to clipboardprint? http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="
复制链接

扫一扫

专栏目录